Forgive me if this is a dumb question, but I''m trying to develop a
table that uses Ajax.Updater to add rows to a table. FF seems to be
ok with this but IE7 doesn''t update the table. I''m using a
Table as
the container, which may be my problem but I can''t seem to find a way
to make the columns line up properly otherwise.
Here''s an example of the code I''m using, the real code reads
data from
the DB to return multiple rows:
== HTML Table =<table>
<tr>
<td width="100%">
<table width="100%" id="rowContainer">
<tr>
<td>
<span>Loading...</span>
</td>
</tr>
</table>
</td>
</tr>
</table>
<script type="text/javascript">
new Ajax.Updater(''rowContainer'',
''inc/ajax_test.htm'', { method:
"get", evalScripts: true });
</script>
===================
== inc/ajax_test.htm file =<tr>
<td width="500">
This is a test (random length data)
</td>
<td width="100">
<a href="somefile.htm">click me</a>
</td>
</tr>
===================
Using a div instead of a table works, but the the columns then do not
line up properly.
--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups
"Ruby on Rails: Spinoffs" group.
To post to this group, send email to
rubyonrails-spinoffs-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
To unsubscribe from this group, send email to
rubyonrails-spinoffs-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
For more options, visit this group at
http://groups.google.com/group/rubyonrails-spinoffs?hl=en
-~----------~----~----~----~------~----~------~--~---
Walter Lee Davis
2007-Nov-02 02:34 UTC
Re: IE can''t use table as the Ajax.Updater container?
On Nov 1, 2007, at 6:54 PM, aadams wrote:> > Forgive me if this is a dumb question, but I''m trying to develop a > table that uses Ajax.Updater to add rows to a table. FF seems to be > ok with this but IE7 doesn''t update the table. I''m using a Table as > the container, which may be my problem but I can''t seem to find a way > to make the columns line up properly otherwise. > > Here''s an example of the code I''m using, the real code reads data from > the DB to return multiple rows: > > == HTML Table => <table> > <tr> > <td width="100%"> > <table width="100%" id="rowContainer"> > <tr> > <td> > <span>Loading...</span> > </td> > </tr> > </table> > </td> > </tr> > </table> > > <script type="text/javascript"> > new Ajax.Updater(''rowContainer'', ''inc/ajax_test.htm'', { method: > "get", evalScripts: true }); > </script> > ===================> > > == inc/ajax_test.htm file => <tr> > <td width="500"> > This is a test (random length data) > </td> > <td width="100"> > <a href="somefile.htm">click me</a> > </td> > </tr> > ===================> > > Using a div instead of a table works, but the the columns then do not > line up properly. >I seem to recall reading somewhere -- maybe on the Scriptaculous Wiki -- that this is a problem if your table doesn''t have <thead> and <tbody> tags. Try adding those, and see if it helps. Otherwise, you may need to use a different container, maybe an unordered list containing sized (width) divs set to float next to one another. For example, I believe this construction would work: ul.faux_table { float: left; width: 800px; list-style-type: none; padding: 0; margin: 0; } ul.faux_table li { padding:0; margin: 0; } li div { float: left; } ,col1 { width: 100px; } .col2 { width: 200px; } ... whatever widths you want for the columns, as long as they add up to your container width. <ul class="faux_table"> <li id="row_1"><div class="col1">Column 1 stuff here</div><div class="col2">Column 2 stuff here</div> ... </li> ... </ul> Floating the container (ul) left makes the floated divs stay in their own rows, and then you can either style the div or the li to get rules between rows or columns. Walter --~--~---------~--~----~------------~-------~--~----~ You received this message because you are subscribed to the Google Groups "Ruby on Rails: Spinoffs" group. To post to this group, send email to rubyonrails-spinoffs-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org To unsubscribe from this group, send email to rubyonrails-spinoffs-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org For more options, visit this group at http://groups.google.com/group/rubyonrails-spinoffs?hl=en -~----------~----~----~----~------~----~------~--~---
Thanks for the reply Walter. I tried implementing the thead/tbody tags and it did not help. I''ll try your ul/li suggestion and see if all goes well. Man I hate IE. On Nov 1, 7:34 pm, Walter Lee Davis <wa...-HQgmohHLjDZWk0Htik3J/w@public.gmane.org> wrote:> On Nov 1, 2007, at 6:54 PM, aadams wrote: > > > > > > > Forgive me if this is a dumb question, but I''m trying to develop a > > table that uses Ajax.Updater to add rows to a table. FF seems to be > > ok with this but IE7 doesn''t update the table. I''m using a Table as > > the container, which may be my problem but I can''t seem to find a way > > to make the columns line up properly otherwise. > > > Here''s an example of the code I''m using, the real code reads data from > > the DB to return multiple rows: > > > == HTML Table => > <table> > > <tr> > > <td width="100%"> > > <table width="100%" id="rowContainer"> > > <tr> > > <td> > > <span>Loading...</span> > > </td> > > </tr> > > </table> > > </td> > > </tr> > > </table> > > > <script type="text/javascript"> > > new Ajax.Updater(''rowContainer'', ''inc/ajax_test.htm'', { method: > > "get", evalScripts: true }); > > </script> > > ===================> > > == inc/ajax_test.htm file => > <tr> > > <td width="500"> > > This is a test (random length data) > > </td> > > <td width="100"> > > <a href="somefile.htm">click me</a> > > </td> > > </tr> > > ===================> > > Using a div instead of a table works, but the the columns then do not > > line up properly. > > I seem to recall reading somewhere -- maybe on the Scriptaculous Wiki > -- that this is a problem if your table doesn''t have <thead> and > <tbody> tags. Try adding those, and see if it helps. > > Otherwise, you may need to use a different container, maybe an > unordered list containing sized (width) divs set to float next to one > another. For example, I believe this construction would work: > > ul.faux_table { > float: left; > width: 800px; > list-style-type: none; > padding: 0; > margin: 0;} > > ul.faux_table li { > padding:0; > margin: 0; > > } > > li div { > float: left; > > } > > ,col1 { > width: 100px;} > > .col2 { > width: 200px; > > } > > ... whatever widths you want for the columns, as long as they add up > to your container width. > > <ul class="faux_table"> > <li id="row_1"><div class="col1">Column 1 stuff here</div><div > class="col2">Column 2 stuff here</div> ... </li> > ... > </ul> > > Floating the container (ul) left makes the floated divs stay in their > own rows, and then you can either style the div or the li to get > rules between rows or columns. > > Walter--~--~---------~--~----~------------~-------~--~----~ You received this message because you are subscribed to the Google Groups "Ruby on Rails: Spinoffs" group. To post to this group, send email to rubyonrails-spinoffs-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org To unsubscribe from this group, send email to rubyonrails-spinoffs-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org For more options, visit this group at http://groups.google.com/group/rubyonrails-spinoffs?hl=en -~----------~----~----~----~------~----~------~--~---
Just for the record Walter''s suggestion to use ul/li did the trick for this one. If I had more complex tables though it wouldn''t be as graceful. On Nov 2, 11:31 am, aadams <aad...-L5V2zLUpbopl57MIdRCFDg@public.gmane.org> wrote:> Thanks for the reply Walter. > > I tried implementing the thead/tbody tags and it did not help. I''ll > try your ul/li suggestion and see if all goes well. Man I hate IE. > > On Nov 1, 7:34 pm, Walter Lee Davis <wa...-HQgmohHLjDZWk0Htik3J/w@public.gmane.org> wrote: > > > On Nov 1, 2007, at 6:54 PM, aadams wrote: > > > > Forgive me if this is a dumb question, but I''m trying to develop a > > > table that uses Ajax.Updater to add rows to a table. FF seems to be > > > ok with this but IE7 doesn''t update the table. I''m using a Table as > > > the container, which may be my problem but I can''t seem to find a way > > > to make the columns line up properly otherwise. > > > > Here''s an example of the code I''m using, the real code reads data from > > > the DB to return multiple rows: > > > > == HTML Table => > > <table> > > > <tr> > > > <td width="100%"> > > > <table width="100%" id="rowContainer"> > > > <tr> > > > <td> > > > <span>Loading...</span> > > > </td> > > > </tr> > > > </table> > > > </td> > > > </tr> > > > </table> > > > > <script type="text/javascript"> > > > new Ajax.Updater(''rowContainer'', ''inc/ajax_test.htm'', { method: > > > "get", evalScripts: true }); > > > </script> > > > ===================> > > > == inc/ajax_test.htm file => > > <tr> > > > <td width="500"> > > > This is a test (random length data) > > > </td> > > > <td width="100"> > > > <a href="somefile.htm">click me</a> > > > </td> > > > </tr> > > > ===================> > > > Using a div instead of a table works, but the the columns then do not > > > line up properly. > > > I seem to recall reading somewhere -- maybe on the Scriptaculous Wiki > > -- that this is a problem if your table doesn''t have <thead> and > > <tbody> tags. Try adding those, and see if it helps. > > > Otherwise, you may need to use a different container, maybe an > > unordered list containing sized (width) divs set to float next to one > > another. For example, I believe this construction would work: > > > ul.faux_table { > > float: left; > > width: 800px; > > list-style-type: none; > > padding: 0; > > margin: 0;} > > > ul.faux_table li { > > padding:0; > > margin: 0; > > > } > > > li div { > > float: left; > > > } > > > ,col1 { > > width: 100px;} > > > .col2 { > > width: 200px; > > > } > > > ... whatever widths you want for the columns, as long as they add up > > to your container width. > > > <ul class="faux_table"> > > <li id="row_1"><div class="col1">Column 1 stuff here</div><div > > class="col2">Column 2 stuff here</div> ... </li> > > ... > > </ul> > > > Floating the container (ul) left makes the floated divs stay in their > > own rows, and then you can either style the div or the li to get > > rules between rows or columns. > > > Walter--~--~---------~--~----~------------~-------~--~----~ You received this message because you are subscribed to the Google Groups "Ruby on Rails: Spinoffs" group. To post to this group, send email to rubyonrails-spinoffs-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org To unsubscribe from this group, send email to rubyonrails-spinoffs-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org For more options, visit this group at http://groups.google.com/group/rubyonrails-spinoffs?hl=en -~----------~----~----~----~------~----~------~--~---
I had the same problem. I was able to get it to work in IE 6 if the
table and tbody were already defined in the original html. The html
before the update looks like this:
<table>
<thead>
<tr>
<th>Session</th><th>ReportName</th><th>Status</th><th>User</
th><th>Customer</th><th>Printer</th>
</tr>
</thead>
<tbody id="reportTable">
<tr class=''even''>
<td colspan="7" style="white-space:
nowrap;vertical-align:
bottom;"><strong><center>No reports status
available</center></
strong></td>
</tr>
</tbody>
</table>
<script type="text/javascript">
updateReportStatusTable();
</script>
And then the javascript is like this. The servlet returns the rows
(<tr>) that are to go inside the tbody.
function updateReportStatusTable() {
var myAjax = new Ajax.Updater(''reportTable'',''/app/
reports_status_table.do'', {parameters: { userName:
''All'' }, method:
''post'' });
}
Hope that helps!
On Nov 2, 12:27 pm, aadams
<aad...-L5V2zLUpbopl57MIdRCFDg@public.gmane.org>
wrote:> Just for the record Walter''s suggestion touseul/li did the trick
for
> this one. If I had more complex tables though it wouldn''t be as
> graceful.
>
> On Nov 2, 11:31 am, aadams
<aad...-L5V2zLUpbopl57MIdRCFDg@public.gmane.org> wrote:
>
>
>
> > Thanks for the reply Walter.
>
> > I tried implementing the thead/tbody tags and it did not help.
I''ll
> > try your ul/li suggestion and see if all goes well. Man I hateIE.
>
> > On Nov 1, 7:34 pm, Walter Lee Davis
<wa...-HQgmohHLjDZWk0Htik3J/w@public.gmane.org> wrote:
>
> > > On Nov 1, 2007, at 6:54 PM, aadams wrote:
>
> > > > Forgive me if this is a dumb question, but I''m
trying to develop a
> > > >tablethat usesAjax.Updaterto add rows to atable. FF seems to
be
> > > > ok with this but IE7 doesn''t update thetable.
I''m using aTableas
> > > > thecontainer, which may be my problem but
Ican''tseem to find a way
> > > > to make the columns line up properly otherwise.
>
> > > > Here''s an example of the code I''m using,
the real code reads data from
> > > > the DB to return multiple rows:
>
> > > > == HTMLTable=> > > > <table>
> > > > <tr>
> > > > <td width="100%">
> > > > <tablewidth="100%"
id="rowContainer">
> > > > <tr>
> > > > <td>
> > > >
<span>Loading...</span>
> > > > </td>
> > > > </tr>
> > > > </table>
> > > > </td>
> > > > </tr>
> > > > </table>
>
> > > > <script type="text/javascript">
> > > > newAjax.Updater(''rowContainer'',
''inc/ajax_test.htm'', { method:
> > > > "get", evalScripts: true });
> > > > </script>
> > > > ===================>
> > > > == inc/ajax_test.htm file => > > > <tr>
> > > > <td width="500">
> > > > This is a test (random length data)
> > > > </td>
> > > > <td width="100">
> > > > <a href="somefile.htm">click
me</a>
> > > > </td>
> > > > </tr>
> > > > ===================>
> > > > Using a div instead of atableworks, but the the columns then
do not
> > > > line up properly.
>
> > > I seem to recall reading somewhere -- maybe on the Scriptaculous
Wiki
> > > -- that this is a problem if yourtabledoesn''t have
<thead> and
> > > <tbody> tags. Try adding those, and see if it helps.
>
> > > Otherwise, you may need tousea differentcontainer, maybe an
> > > unordered list containing sized (width) divs set to float next to
one
> > > another. For example, I believe this construction would work:
>
> > > ul.faux_table {
> > > float: left;
> > > width: 800px;
> > > list-style-type: none;
> > > padding: 0;
> > > margin: 0;}
>
> > > ul.faux_table li {
> > > padding:0;
> > > margin: 0;
>
> > > }
>
> > > li div {
> > > float: left;
>
> > > }
>
> > > ,col1 {
> > > width: 100px;}
>
> > > .col2 {
> > > width: 200px;
>
> > > }
>
> > > ... whatever widths you want for the columns, as long as they add
up
> > > to yourcontainerwidth.
>
> > > <ul class="faux_table">
> > > <li id="row_1"><div
class="col1">Column 1 stuff here</div><div
> > > class="col2">Column 2 stuff here</div> ...
</li>
> > > ...
> > > </ul>
>
> > > Floating thecontainer(ul) left makes the floated divs stay in
their
> > > own rows, and then you can either style the div or the li to get
> > > rules between rows or columns.
>
> > > Walter- Hide quoted text -
>
> - Show quoted text -
--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups
"Ruby on Rails: Spinoffs" group.
To post to this group, send email to
rubyonrails-spinoffs-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
To unsubscribe from this group, send email to
rubyonrails-spinoffs-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
For more options, visit this group at
http://groups.google.com/group/rubyonrails-spinoffs?hl=en
-~----------~----~----~----~------~----~------~--~---
Hi Tunzis, thanks for the reply! Unfortunately this is exactly how I was doing it, though I was testing on IE7. Maybe that was the difference? On Nov 6, 1:22 pm, Tunzis <dcross...-PkbjNfxxIARBDgjK7y7TUQ@public.gmane.org> wrote:> I had the same problem. I was able to get it to work in IE 6 if the > table and tbody were already defined in the original html. The html > before the update looks like this: > > <table> > <thead> > <tr> > <th>Session</th><th>ReportName</th><th>Status</th><th>User</ > th><th>Customer</th><th>Printer</th> > </tr> > </thead> > <tbody id="reportTable"> > <tr class=''even''> > <td colspan="7" style="white-space: nowrap;vertical-align: > bottom;"><strong><center>No reports status available</center></ > strong></td> > </tr> > </tbody> > </table> > <script type="text/javascript"> > updateReportStatusTable(); > </script> > > And then the javascript is like this. The servlet returns the rows > (<tr>) that are to go inside the tbody. > > function updateReportStatusTable() { > var myAjax = new Ajax.Updater(''reportTable'',''/app/ > reports_status_table.do'', {parameters: { userName: ''All'' }, method: > ''post'' }); > > } > > Hope that helps! > > On Nov 2, 12:27 pm, aadams <aad...-L5V2zLUpbopl57MIdRCFDg@public.gmane.org> wrote: > > > Just for the record Walter''s suggestion touseul/li did the trick for > > this one. If I had more complex tables though it wouldn''t be as > > graceful. > > > On Nov 2, 11:31 am, aadams <aad...-L5V2zLUpbopl57MIdRCFDg@public.gmane.org> wrote: > > > > Thanks for the reply Walter. > > > > I tried implementing the thead/tbody tags and it did not help. I''ll > > > try your ul/li suggestion and see if all goes well. Man I hateIE. > > > > On Nov 1, 7:34 pm, Walter Lee Davis <wa...-HQgmohHLjDZWk0Htik3J/w@public.gmane.org> wrote: > > > > > On Nov 1, 2007, at 6:54 PM, aadams wrote: > > > > > > Forgive me if this is a dumb question, but I''m trying to develop a > > > > >tablethat usesAjax.Updaterto add rows to atable. FF seems to be > > > > > ok with this but IE7 doesn''t update thetable. I''m using aTableas > > > > > thecontainer, which may be my problem but Ican''tseem to find a way > > > > > to make the columns line up properly otherwise. > > > > > > Here''s an example of the code I''m using, the real code reads data from > > > > > the DB to return multiple rows: > > > > > > == HTMLTable=> > > > > <table> > > > > > <tr> > > > > > <td width="100%"> > > > > > <tablewidth="100%" id="rowContainer"> > > > > > <tr> > > > > > <td> > > > > > <span>Loading...</span> > > > > > </td> > > > > > </tr> > > > > > </table> > > > > > </td> > > > > > </tr> > > > > > </table> > > > > > > <script type="text/javascript"> > > > > > newAjax.Updater(''rowContainer'', ''inc/ajax_test.htm'', { method: > > > > > "get", evalScripts: true }); > > > > > </script> > > > > > ===================> > > > > > == inc/ajax_test.htm file => > > > > <tr> > > > > > <td width="500"> > > > > > This is a test (random length data) > > > > > </td> > > > > > <td width="100"> > > > > > <a href="somefile.htm">click me</a> > > > > > </td> > > > > > </tr> > > > > > ===================> > > > > > Using a div instead of atableworks, but the the columns then do not > > > > > line up properly. > > > > > I seem to recall reading somewhere -- maybe on the Scriptaculous Wiki > > > > -- that this is a problem if yourtabledoesn''t have <thead> and > > > > <tbody> tags. Try adding those, and see if it helps. > > > > > Otherwise, you may need tousea differentcontainer, maybe an > > > > unordered list containing sized (width) divs set to float next to one > > > > another. For example, I believe this construction would work: > > > > > ul.faux_table { > > > > float: left; > > > > width: 800px; > > > > list-style-type: none; > > > > padding: 0; > > > > margin: 0;} > > > > > ul.faux_table li { > > > > padding:0; > > > > margin: 0; > > > > > } > > > > > li div { > > > > float: left; > > > > > } > > > > > ,col1 { > > > > width: 100px;} > > > > > .col2 { > > > > width: 200px; > > > > > } > > > > > ... whatever widths you want for the columns, as long as they add up > > > > to yourcontainerwidth. > > > > > <ul class="faux_table"> > > > > <li id="row_1"><div class="col1">Column 1 stuff here</div><div > > > > class="col2">Column 2 stuff here</div> ... </li> > > > > ... > > > > </ul> > > > > > Floating thecontainer(ul) left makes the floated divs stay in their > > > > own rows, and then you can either style the div or the li to get > > > > rules between rows or columns. > > > > > Walter- Hide quoted text - > > > - Show quoted text ---~--~---------~--~----~------------~-------~--~----~ You received this message because you are subscribed to the Google Groups "Ruby on Rails: Spinoffs" group. To post to this group, send email to rubyonrails-spinoffs-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org To unsubscribe from this group, send email to rubyonrails-spinoffs-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org For more options, visit this group at http://groups.google.com/group/rubyonrails-spinoffs?hl=en -~----------~----~----~----~------~----~------~--~---
Ahhh IE, how you continue to suck...
The problem lies in the innerHTML property which is read only for
table and tbody elements.
http://msdn2.microsoft.com/en-us/library/ms533897.aspx
Cheers,
Matt
On Nov 6, 5:00 pm, aadams <aad...-L5V2zLUpbopl57MIdRCFDg@public.gmane.org>
wrote:> Hi Tunzis, thanks for the reply! Unfortunately this is exactly how I
> was doing it, though I was testing on IE7. Maybe that was the
> difference?
>
> On Nov 6, 1:22 pm, Tunzis
<dcross...-PkbjNfxxIARBDgjK7y7TUQ@public.gmane.org> wrote:
>
> > I had the same problem. I was able to get it to work in IE 6 if the
> > table and tbody were already defined in the original html. The html
> > before the update looks like this:
>
> > <table>
> > <thead>
> > <tr>
> >
<th>Session</th><th>ReportName</th><th>Status</th><th>User</
> > th><th>Customer</th><th>Printer</th>
> > </tr>
> > </thead>
> > <tbody id="reportTable">
> > <tr class=''even''>
> > <td colspan="7" style="white-space:
nowrap;vertical-align:
> > bottom;"><strong><center>No reports status
available</center></
> > strong></td>
> > </tr>
> > </tbody>
> > </table>
> > <script type="text/javascript">
> > updateReportStatusTable();
> > </script>
>
> > And then the javascript is like this. The servlet returns the rows
> > (<tr>) that are to go inside the tbody.
>
> > function updateReportStatusTable() {
> > var myAjax = new
Ajax.Updater(''reportTable'',''/app/
> > reports_status_table.do'', {parameters: { userName:
''All'' }, method:
> > ''post'' });
>
> > }
>
> > Hope that helps!
>
> > On Nov 2, 12:27 pm, aadams
<aad...-L5V2zLUpbopl57MIdRCFDg@public.gmane.org> wrote:
>
> > > Just for the record Walter''s suggestion touseul/li did
the trick for
> > > this one. If I had more complex tables though it
wouldn''t be as
> > > graceful.
>
> > > On Nov 2, 11:31 am, aadams
<aad...-L5V2zLUpbopl57MIdRCFDg@public.gmane.org> wrote:
>
> > > > Thanks for the reply Walter.
>
> > > > I tried implementing the thead/tbody tags and it did not
help. I''ll
> > > > try your ul/li suggestion and see if all goes well. Man I
hateIE.
>
> > > > On Nov 1, 7:34 pm, Walter Lee Davis
<wa...-HQgmohHLjDZWk0Htik3J/w@public.gmane.org> wrote:
>
> > > > > On Nov 1, 2007, at 6:54 PM, aadams wrote:
>
> > > > > > Forgive me if this is a dumb question, but
I''m trying to develop a
> > > > > >tablethat usesAjax.Updaterto add rows to atable.
FF seems to be
> > > > > > ok with this but IE7 doesn''t update
thetable. I''m using aTableas
> > > > > > thecontainer, which may be my problem but
Ican''tseem to find a way
> > > > > > to make the columns line up properly otherwise.
>
> > > > > > Here''s an example of the code
I''m using, the real code reads data from
> > > > > > the DB to return multiple rows:
>
> > > > > > == HTMLTable=> > > > > >
<table>
> > > > > > <tr>
> > > > > > <td width="100%">
> > > > > > <tablewidth="100%"
id="rowContainer">
> > > > > > <tr>
> > > > > > <td>
> > > > > >
<span>Loading...</span>
> > > > > > </td>
> > > > > > </tr>
> > > > > > </table>
> > > > > > </td>
> > > > > > </tr>
> > > > > > </table>
>
> > > > > > <script type="text/javascript">
> > > > > >
newAjax.Updater(''rowContainer'',
''inc/ajax_test.htm'', { method:
> > > > > > "get", evalScripts: true });
> > > > > > </script>
> > > > > > ===================>
> > > > > > == inc/ajax_test.htm file => > > >
> > <tr>
> > > > > > <td width="500">
> > > > > > This is a test (random length data)
> > > > > > </td>
> > > > > > <td width="100">
> > > > > > <a
href="somefile.htm">click me</a>
> > > > > > </td>
> > > > > > </tr>
> > > > > > ===================>
> > > > > > Using a div instead of atableworks, but the the
columns then do not
> > > > > > line up properly.
>
> > > > > I seem to recall reading somewhere -- maybe on the
Scriptaculous Wiki
> > > > > -- that this is a problem if yourtabledoesn''t
have <thead> and
> > > > > <tbody> tags. Try adding those, and see if it
helps.
>
> > > > > Otherwise, you may need tousea differentcontainer,
maybe an
> > > > > unordered list containing sized (width) divs set to
float next to one
> > > > > another. For example, I believe this construction would
work:
>
> > > > > ul.faux_table {
> > > > > float: left;
> > > > > width: 800px;
> > > > > list-style-type: none;
> > > > > padding: 0;
> > > > > margin: 0;}
>
> > > > > ul.faux_table li {
> > > > > padding:0;
> > > > > margin: 0;
>
> > > > > }
>
> > > > > li div {
> > > > > float: left;
>
> > > > > }
>
> > > > > ,col1 {
> > > > > width: 100px;}
>
> > > > > .col2 {
> > > > > width: 200px;
>
> > > > > }
>
> > > > > ... whatever widths you want for the columns, as long
as they add up
> > > > > to yourcontainerwidth.
>
> > > > > <ul class="faux_table">
> > > > > <li id="row_1"><div
class="col1">Column 1 stuff here</div><div
> > > > > class="col2">Column 2 stuff
here</div> ... </li>
> > > > > ...
> > > > > </ul>
>
> > > > > Floating thecontainer(ul) left makes the floated divs
stay in their
> > > > > own rows, and then you can either style the div or the
li to get
> > > > > rules between rows or columns.
>
> > > > > Walter- Hide quoted text -
>
> > > - Show quoted text -
--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups
"Ruby on Rails: Spinoffs" group.
To post to this group, send email to
rubyonrails-spinoffs-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
To unsubscribe from this group, send email to
rubyonrails-spinoffs-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
For more options, visit this group at
http://groups.google.com/group/rubyonrails-spinoffs?hl=en
-~----------~----~----~----~------~----~------~--~---
That should work. Prototype handles those issues for you. Are you using the latest release ? Regards, Tobie On Nov 7, 3:02 pm, Matt Foster <mattfoste...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org> wrote:> Ahhh IE, how you continue to suck... > > The problem lies in the innerHTML property which is read only for > table and tbody elements. > > http://msdn2.microsoft.com/en-us/library/ms533897.aspx > > Cheers, > Matt > > On Nov 6, 5:00 pm, aadams <aad...-L5V2zLUpbopl57MIdRCFDg@public.gmane.org> wrote: > > > Hi Tunzis, thanks for the reply! Unfortunately this is exactly how I > > was doing it, though I was testing on IE7. Maybe that was the > > difference? > > > On Nov 6, 1:22 pm, Tunzis <dcross...-PkbjNfxxIARBDgjK7y7TUQ@public.gmane.org> wrote: > > > > I had the same problem. I was able to get it to work in IE 6 if the > > > table and tbody were already defined in the original html. The html > > > before the update looks like this: > > > > <table> > > > <thead> > > > <tr> > > > <th>Session</th><th>ReportName</th><th>Status</th><th>User</ > > > th><th>Customer</th><th>Printer</th> > > > </tr> > > > </thead> > > > <tbody id="reportTable"> > > > <tr class=''even''> > > > <td colspan="7" style="white-space: nowrap;vertical-align: > > > bottom;"><strong><center>No reports status available</center></ > > > strong></td> > > > </tr> > > > </tbody> > > > </table> > > > <script type="text/javascript"> > > > updateReportStatusTable(); > > > </script> > > > > And then the javascript is like this. The servlet returns the rows > > > (<tr>) that are to go inside the tbody. > > > > function updateReportStatusTable() { > > > var myAjax = new Ajax.Updater(''reportTable'',''/app/ > > > reports_status_table.do'', {parameters: { userName: ''All'' }, method: > > > ''post'' }); > > > > } > > > > Hope that helps! > > > > On Nov 2, 12:27 pm, aadams <aad...-L5V2zLUpbopl57MIdRCFDg@public.gmane.org> wrote: > > > > > Just for the record Walter''s suggestion touseul/li did the trick for > > > > this one. If I had more complex tables though it wouldn''t be as > > > > graceful. > > > > > On Nov 2, 11:31 am, aadams <aad...-L5V2zLUpbopl57MIdRCFDg@public.gmane.org> wrote: > > > > > > Thanks for the reply Walter. > > > > > > I tried implementing the thead/tbody tags and it did not help. I''ll > > > > > try your ul/li suggestion and see if all goes well. Man I hateIE. > > > > > > On Nov 1, 7:34 pm, Walter Lee Davis <wa...-HQgmohHLjDZWk0Htik3J/w@public.gmane.org> wrote: > > > > > > > On Nov 1, 2007, at 6:54 PM, aadams wrote: > > > > > > > > Forgive me if this is a dumb question, but I''m trying to develop a > > > > > > >tablethat usesAjax.Updaterto add rows to atable. FF seems to be > > > > > > > ok with this but IE7 doesn''t update thetable. I''m using aTableas > > > > > > > thecontainer, which may be my problem but Ican''tseem to find a way > > > > > > > to make the columns line up properly otherwise. > > > > > > > > Here''s an example of the code I''m using, the real code reads data from > > > > > > > the DB to return multiple rows: > > > > > > > > == HTMLTable=> > > > > > > <table> > > > > > > > <tr> > > > > > > > <td width="100%"> > > > > > > > <tablewidth="100%" id="rowContainer"> > > > > > > > <tr> > > > > > > > <td> > > > > > > > <span>Loading...</span> > > > > > > > </td> > > > > > > > </tr> > > > > > > > </table> > > > > > > > </td> > > > > > > > </tr> > > > > > > > </table> > > > > > > > > <script type="text/javascript"> > > > > > > > newAjax.Updater(''rowContainer'', ''inc/ajax_test.htm'', { method: > > > > > > > "get", evalScripts: true }); > > > > > > > </script> > > > > > > > ===================> > > > > > > > == inc/ajax_test.htm file => > > > > > > <tr> > > > > > > > <td width="500"> > > > > > > > This is a test (random length data) > > > > > > > </td> > > > > > > > <td width="100"> > > > > > > > <a href="somefile.htm">click me</a> > > > > > > > </td> > > > > > > > </tr> > > > > > > > ===================> > > > > > > > Using a div instead of atableworks, but the the columns then do not > > > > > > > line up properly. > > > > > > > I seem to recall reading somewhere -- maybe on the Scriptaculous Wiki > > > > > > -- that this is a problem if yourtabledoesn''t have <thead> and > > > > > > <tbody> tags. Try adding those, and see if it helps. > > > > > > > Otherwise, you may need tousea differentcontainer, maybe an > > > > > > unordered list containing sized (width) divs set to float next to one > > > > > > another. For example, I believe this construction would work: > > > > > > > ul.faux_table { > > > > > > float: left; > > > > > > width: 800px; > > > > > > list-style-type: none; > > > > > > padding: 0; > > > > > > margin: 0;} > > > > > > > ul.faux_table li { > > > > > > padding:0; > > > > > > margin: 0; > > > > > > > } > > > > > > > li div { > > > > > > float: left; > > > > > > > } > > > > > > > ,col1 { > > > > > > width: 100px;} > > > > > > > .col2 { > > > > > > width: 200px; > > > > > > > } > > > > > > > ... whatever widths you want for the columns, as long as they add up > > > > > > to yourcontainerwidth. > > > > > > > <ul class="faux_table"> > > > > > > <li id="row_1"><div class="col1">Column 1 stuff here</div><div > > > > > > class="col2">Column 2 stuff here</div> ... </li> > > > > > > ... > > > > > > </ul> > > > > > > > Floating thecontainer(ul) left makes the floated divs stay in their > > > > > > own rows, and then you can either style the div or the li to get > > > > > > rules between rows or columns. > > > > > > > Walter- Hide quoted text - > > > > > - Show quoted text ---~--~---------~--~----~------------~-------~--~----~ You received this message because you are subscribed to the Google Groups "Ruby on Rails: Spinoffs" group. To post to this group, send email to rubyonrails-spinoffs-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org To unsubscribe from this group, send email to rubyonrails-spinoffs-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org For more options, visit this group at http://groups.google.com/group/rubyonrails-spinoffs?hl=en -~----------~----~----~----~------~----~------~--~---
I am having a similar problem but with a div element using Updater to load html into a named div. Works fine on Firefox but not on IE and I''ve not been able to discover why. IE just does nothing. On Nov 7, 8:01 pm, Tobie Langel <tobie.lan...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org> wrote:> That should work. > > Prototype handles those issues for you. > > Are you using the latest release ? > > Regards, > > Tobie > > On Nov 7, 3:02 pm, Matt Foster <mattfoste...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org> wrote: > > > Ahhh IE, how you continue to suck... > > > The problem lies in the innerHTML property which is read only for > > table and tbody elements. > > >http://msdn2.microsoft.com/en-us/library/ms533897.aspx > > > Cheers, > > Matt > > > On Nov 6, 5:00 pm, aadams <aad...-L5V2zLUpbopl57MIdRCFDg@public.gmane.org> wrote: > > > > Hi Tunzis, thanks for the reply! Unfortunately this is exactly how I > > > was doing it, though I was testing on IE7. Maybe that was the > > > difference? > > > > On Nov 6, 1:22 pm, Tunzis <dcross...-PkbjNfxxIARBDgjK7y7TUQ@public.gmane.org> wrote: > > > > > I had the same problem. I was able to get it to work in IE 6 if the > > > > table and tbody were already defined in the original html. The html > > > > before the update looks like this: > > > > > <table> > > > > <thead> > > > > <tr> > > > > <th>Session</th><th>ReportName</th><th>Status</th><th>User</ > > > > th><th>Customer</th><th>Printer</th> > > > > </tr> > > > > </thead> > > > > <tbody id="reportTable"> > > > > <tr class=''even''> > > > > <td colspan="7" style="white-space: nowrap;vertical-align: > > > > bottom;"><strong><center>No reports status available</center></ > > > > strong></td> > > > > </tr> > > > > </tbody> > > > > </table> > > > > <script type="text/javascript"> > > > > updateReportStatusTable(); > > > > </script> > > > > > And then the javascript is like this. The servlet returns the rows > > > > (<tr>) that are to go inside the tbody. > > > > > function updateReportStatusTable() { > > > > var myAjax = new Ajax.Updater(''reportTable'',''/app/ > > > > reports_status_table.do'', {parameters: { userName: ''All'' }, method: > > > > ''post'' }); > > > > > } > > > > > Hope that helps! > > > > > On Nov 2, 12:27 pm, aadams <aad...-L5V2zLUpbopl57MIdRCFDg@public.gmane.org> wrote: > > > > > > Just for the record Walter''s suggestion touseul/li did the trick for > > > > > this one. If I had more complex tables though it wouldn''t be as > > > > > graceful. > > > > > > On Nov 2, 11:31 am, aadams <aad...-L5V2zLUpbopl57MIdRCFDg@public.gmane.org> wrote: > > > > > > > Thanks for the reply Walter. > > > > > > > I tried implementing the thead/tbody tags and it did not help. I''ll > > > > > > try your ul/li suggestion and see if all goes well. Man I hateIE. > > > > > > > On Nov 1, 7:34 pm, Walter Lee Davis <wa...-HQgmohHLjDZWk0Htik3J/w@public.gmane.org> wrote: > > > > > > > > On Nov 1, 2007, at 6:54 PM, aadams wrote: > > > > > > > > > Forgive me if this is a dumb question, but I''m trying to develop a > > > > > > > >tablethat usesAjax.Updaterto add rows to atable. FF seems to be > > > > > > > > ok with this but IE7 doesn''t update thetable. I''m using aTableas > > > > > > > > thecontainer, which may be my problem but Ican''tseem to find a way > > > > > > > > to make the columns line up properly otherwise. > > > > > > > > > Here''s an example of the code I''m using, the real code reads data from > > > > > > > > the DB to return multiple rows: > > > > > > > > > == HTMLTable=> > > > > > > > <table> > > > > > > > > <tr> > > > > > > > > <td width="100%"> > > > > > > > > <tablewidth="100%" id="rowContainer"> > > > > > > > > <tr> > > > > > > > > <td> > > > > > > > > <span>Loading...</span> > > > > > > > > </td> > > > > > > > > </tr> > > > > > > > > </table> > > > > > > > > </td> > > > > > > > > </tr> > > > > > > > > </table> > > > > > > > > > <script type="text/javascript"> > > > > > > > > newAjax.Updater(''rowContainer'', ''inc/ajax_test.htm'', { method: > > > > > > > > "get", evalScripts: true }); > > > > > > > > </script> > > > > > > > > ===================> > > > > > > > > == inc/ajax_test.htm file => > > > > > > > <tr> > > > > > > > > <td width="500"> > > > > > > > > This is a test (random length data) > > > > > > > > </td> > > > > > > > > <td width="100"> > > > > > > > > <a href="somefile.htm">click me</a> > > > > > > > > </td> > > > > > > > > </tr> > > > > > > > > ===================> > > > > > > > > Using a div instead of atableworks, but the the columns then do not > > > > > > > > line up properly. > > > > > > > > I seem to recall reading somewhere -- maybe on the Scriptaculous Wiki > > > > > > > -- that this is a problem if yourtabledoesn''t have <thead> and > > > > > > > <tbody> tags. Try adding those, and see if it helps. > > > > > > > > Otherwise, you may need tousea differentcontainer, maybe an > > > > > > > unordered list containing sized (width) divs set to float next to one > > > > > > > another. For example, I believe this construction would work: > > > > > > > > ul.faux_table { > > > > > > > float: left; > > > > > > > width: 800px; > > > > > > > list-style-type: none; > > > > > > > padding: 0; > > > > > > > margin: 0;} > > > > > > > > ul.faux_table li { > > > > > > > padding:0; > > > > > > > margin: 0; > > > > > > > > } > > > > > > > > li div { > > > > > > > float: left; > > > > > > > > } > > > > > > > > ,col1 { > > > > > > > width: 100px;} > > > > > > > > .col2 { > > > > > > > width: 200px; > > > > > > > > } > > > > > > > > ... whatever widths you want for the columns, as long as they add up > > > > > > > to yourcontainerwidth. > > > > > > > > <ul class="faux_table"> > > > > > > > <li id="row_1"><div class="col1">Column 1 stuff here</div><div > > > > > > > class="col2">Column 2 stuff here</div> ... </li> > > > > > > > ... > > > > > > > </ul> > > > > > > > > Floating thecontainer(ul) left makes the floated divs stay in their > > > > > > > own rows, and then you can either style the div or the li to get > > > > > > > rules between rows or columns. > > > > > > > > Walter- Hide quoted text - > > > > > > - Show quoted text ---~--~---------~--~----~------------~-------~--~----~ You received this message because you are subscribed to the Google Groups "Ruby on Rails: Spinoffs" group. To post to this group, send email to rubyonrails-spinoffs-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org To unsubscribe from this group, send email to rubyonrails-spinoffs-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org For more options, visit this group at http://groups.google.com/group/rubyonrails-spinoffs?hl=en -~----------~----~----~----~------~----~------~--~---
@Melles: Do you have an example for us? ''Cause even though IE is bad for your health, it is supposed to handle something that simple. All I could think of right now is that you perhaps forgot to extend the element you are updating... As far as I know prototype still doesn''t extend all the native objects in IE like it does in Firefox. Greetz On Nov 8, 12:14 am, Melles <quillu...-gM/Ye1E23mwN+BqQ9rBEUg@public.gmane.org> wrote:> I am having a similar problem but with a div element using Updater to > load html into a named div. Works fine on Firefox but not on IE and > I''ve not been able to discover why. IE just does nothing. > > On Nov 7, 8:01 pm, Tobie Langel <tobie.lan...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org> wrote: > > > That should work. > > > Prototype handles those issues for you. > > > Are you using the latest release ? > > > Regards, > > > Tobie > > > On Nov 7, 3:02 pm, Matt Foster <mattfoste...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org> wrote: > > > > Ahhh IE, how you continue to suck... > > > > The problem lies in the innerHTML property which is read only for > > > table and tbody elements. > > > >http://msdn2.microsoft.com/en-us/library/ms533897.aspx > > > > Cheers, > > > Matt > > > > On Nov 6, 5:00 pm, aadams <aad...-L5V2zLUpbopl57MIdRCFDg@public.gmane.org> wrote: > > > > > Hi Tunzis, thanks for the reply! Unfortunately this is exactly how I > > > > was doing it, though I was testing on IE7. Maybe that was the > > > > difference? > > > > > On Nov 6, 1:22 pm, Tunzis <dcross...-PkbjNfxxIARBDgjK7y7TUQ@public.gmane.org> wrote: > > > > > > I had the same problem. I was able to get it to work in IE 6 if the > > > > > table and tbody were already defined in the original html. The html > > > > > before the update looks like this: > > > > > > <table> > > > > > <thead> > > > > > <tr> > > > > > <th>Session</th><th>ReportName</th><th>Status</th><th>User</ > > > > > th><th>Customer</th><th>Printer</th> > > > > > </tr> > > > > > </thead> > > > > > <tbody id="reportTable"> > > > > > <tr class=''even''> > > > > > <td colspan="7" style="white-space: nowrap;vertical-align: > > > > > bottom;"><strong><center>No reports status available</center></ > > > > > strong></td> > > > > > </tr> > > > > > </tbody> > > > > > </table> > > > > > <script type="text/javascript"> > > > > > updateReportStatusTable(); > > > > > </script> > > > > > > And then the javascript is like this. The servlet returns the rows > > > > > (<tr>) that are to go inside the tbody. > > > > > > function updateReportStatusTable() { > > > > > var myAjax = new Ajax.Updater(''reportTable'',''/app/ > > > > > reports_status_table.do'', {parameters: { userName: ''All'' }, method: > > > > > ''post'' }); > > > > > > } > > > > > > Hope that helps! > > > > > > On Nov 2, 12:27 pm, aadams <aad...-L5V2zLUpbopl57MIdRCFDg@public.gmane.org> wrote: > > > > > > > Just for the record Walter''s suggestion touseul/li did the trick for > > > > > > this one. If I had more complex tables though it wouldn''t be as > > > > > > graceful. > > > > > > > On Nov 2, 11:31 am, aadams <aad...-L5V2zLUpbopl57MIdRCFDg@public.gmane.org> wrote: > > > > > > > > Thanks for the reply Walter. > > > > > > > > I tried implementing the thead/tbody tags and it did not help. I''ll > > > > > > > try your ul/li suggestion and see if all goes well. Man I hateIE. > > > > > > > > On Nov 1, 7:34 pm, Walter Lee Davis <wa...-HQgmohHLjDZWk0Htik3J/w@public.gmane.org> wrote: > > > > > > > > > On Nov 1, 2007, at 6:54 PM, aadams wrote: > > > > > > > > > > Forgive me if this is a dumb question, but I''m trying to develop a > > > > > > > > >tablethat usesAjax.Updaterto add rows to atable. FF seems to be > > > > > > > > > ok with this but IE7 doesn''t update thetable. I''m using aTableas > > > > > > > > > thecontainer, which may be my problem but Ican''tseem to find a way > > > > > > > > > to make the columns line up properly otherwise. > > > > > > > > > > Here''s an example of the code I''m using, the real code reads data from > > > > > > > > > the DB to return multiple rows: > > > > > > > > > > == HTMLTable=> > > > > > > > > <table> > > > > > > > > > <tr> > > > > > > > > > <td width="100%"> > > > > > > > > > <tablewidth="100%" id="rowContainer"> > > > > > > > > > <tr> > > > > > > > > > <td> > > > > > > > > > <span>Loading...</span> > > > > > > > > > </td> > > > > > > > > > </tr> > > > > > > > > > </table> > > > > > > > > > </td> > > > > > > > > > </tr> > > > > > > > > > </table> > > > > > > > > > > <script type="text/javascript"> > > > > > > > > > newAjax.Updater(''rowContainer'', ''inc/ajax_test.htm'', { method: > > > > > > > > > "get", evalScripts: true }); > > > > > > > > > </script> > > > > > > > > > ===================> > > > > > > > > > == inc/ajax_test.htm file => > > > > > > > > <tr> > > > > > > > > > <td width="500"> > > > > > > > > > This is a test (random length data) > > > > > > > > > </td> > > > > > > > > > <td width="100"> > > > > > > > > > <a href="somefile.htm">click me</a> > > > > > > > > > </td> > > > > > > > > > </tr> > > > > > > > > > ===================> > > > > > > > > > Using a div instead of atableworks, but the the columns then do not > > > > > > > > > line up properly. > > > > > > > > > I seem to recall reading somewhere -- maybe on the Scriptaculous Wiki > > > > > > > > -- that this is a problem if yourtabledoesn''t have <thead> and > > > > > > > > <tbody> tags. Try adding those, and see if it helps. > > > > > > > > > Otherwise, you may need tousea differentcontainer, maybe an > > > > > > > > unordered list containing sized (width) divs set to float next to one > > > > > > > > another. For example, I believe this construction would work: > > > > > > > > > ul.faux_table { > > > > > > > > float: left; > > > > > > > > width: 800px; > > > > > > > > list-style-type: none; > > > > > > > > padding: 0; > > > > > > > > margin: 0;} > > > > > > > > > ul.faux_table li { > > > > > > > > padding:0; > > > > > > > > margin: 0; > > > > > > > > > } > > > > > > > > > li div { > > > > > > > > float: left; > > > > > > > > > } > > > > > > > > > ,col1 { > > > > > > > > width: 100px;} > > > > > > > > > .col2 { > > > > > > > > width: 200px; > > > > > > > > > } > > > > > > > > > ... whatever widths you want for the columns, as long as they add up > > > > > > > > to yourcontainerwidth. > > > > > > > > > <ul class="faux_table"> > > > > > > > > <li id="row_1"><div class="col1">Column 1 stuff here</div><div > > > > > > > > class="col2">Column 2 stuff here</div> ... </li> > > > > > > > > ... > > > > > > > > </ul> > > > > > > > > > Floating thecontainer(ul) left makes the floated divs stay in their > > > > > > > > own rows, and then you can either style the div or the li to get > > > > > > > > rules between rows or columns. > > > > > > > > > Walter- Hide quoted text - > > > > > > > - Show quoted text ---~--~---------~--~----~------------~-------~--~----~ You received this message because you are subscribed to the Google Groups "Ruby on Rails: Spinoffs" group. To post to this group, send email to rubyonrails-spinoffs-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org To unsubscribe from this group, send email to rubyonrails-spinoffs-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org For more options, visit this group at http://groups.google.com/group/rubyonrails-spinoffs?hl=en -~----------~----~----~----~------~----~------~--~---