Forum: Ruby on Rails ajax with tables

Announcement (2017-05-07): www.ruby-forum.com is now read-only since I unfortunately do not have the time to support and maintain the forum any more. Please see rubyonrails.org/community and ruby-lang.org/en/community for other Rails- und Ruby-related community platforms.
Ff82af3238a57fbd1212832ec1a19f28?d=identicon&s=25 Dylan Stamat (Guest)
on 2006-03-08 06:43
(Received via mailing list)
There may be an easy solution, but I just can't seem to get this to
work...

I'm using tables for part of my site, as they contain a lot of rows and
columns full of financial data, so just working with div's and dd's...
etc,
won't do.
My table structure is pretty simple, as follows:

=================
<table id="items">
  <tr>
    <th>name</th>
    <th>date</th>
   </tr>
    <!-- rendering rest of TR's here via a partial and collection -->
</table>
=================

Now, I'm trying to use ajax to insert additional TR's  to the top of the
"items"  table.
This works absolutely perfect, only if I omit the TR's that contain the
TH's.

I can't seem to find a way to update the list at the top, and have the
TR's
be inserted "below" the TH's.

Seems like a common task to push something on the top of a table, but
the
darn table headings is messing up my whole schtic :)
Any ideas would be greatly appreciated.
6f7c877de704c7cc03c8a3b2dc52df92?d=identicon&s=25 Carmen --- (carmen)
on 2006-03-08 06:50
give the header row an id like 'header' and insert the new tr's after
that..
Ff82af3238a57fbd1212832ec1a19f28?d=identicon&s=25 Dylan Stamat (Guest)
on 2006-03-08 07:17
(Received via mailing list)
In this case, the TR is added "directly" below the TR with an id of
'header', which contains the table headers.
So, it ends up rendering like:

<table>
  <tr id="items">
      <tr>
         <td>this new TR inserted here.  doh !</td>
       </tr>
    <th>name</th>
    <th>date</th>
   </tr>

As you can see, it doesn't add after the entire element, but after the
declaration, as the TH elements are nested within the TR.
E8e919d69a7afa8b44c2b887c545dcbb?d=identicon&s=25 Colin Stein (Guest)
on 2006-03-08 07:21
A slight change in table to add a thead for the header cells would not
only make your task easier, but also offer improvements to your users
(ie: when printing).

view.rhtml
============
<table>
  <thead>
    <tr>
      <th scope="col">Name</th>
      <th scope="col">Date</th>
    </tr>
  </thead>
  <tbody id="insert-here">
    <%= render :partial => 'item', :collection => @items %>
  </tbody>
</table>
==========

_item.rhtml
==========
<tr>
  <td><%= item.name %></td>
  <td<%= item.date %></td>
</tr>
==========

With a table set up this way you can insert the partial into the top of
"insert-here" with a "page.insert_html :top, :partial => 'item'" using
RJS (for example).
Ff82af3238a57fbd1212832ec1a19f28?d=identicon&s=25 Dylan Stamat (Guest)
on 2006-03-08 07:29
(Received via mailing list)
Hot damn Colin... that did it :)

I thought I read somewhere that not all browsers support the
thead/tbody/tfoot syntax... but "not all browsers" is probably a very
cliche
term anyway.
I'm not a "web designer" per se... and obviously need to read up on
table
structures :)

Thank you very much Colin !!
This topic is locked and can not be replied to.