Forum: Ruby on Rails AJAX - weird display

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.
28c315da59bc0bc0a544ed4a75ad26e9?d=identicon&s=25 Pierre-Alexandre Meyer (Guest)
on 2007-02-28 11:35
(Received via mailing list)
Hi,

I have a tabular (it's a form actually) with text_fields and buttons.
I wanted to diplay a particular row when a button is set to 'yes'.
Everything's working fine except, that my new row is diplayed at the top
of the array and not where I want. I can do page.add_html/delete and
specify bottom, but I don't understand why my snippet doesn't work.

Any idea?

<tr>
<td class="ror_rocks" colspan=5>Used to programming in Ruby?</td>
<td class="ror_rocks"><%= radio_button :form,:ruby,:yes, :onclick =>
remote_function(:url => {:controller => '/my_controler', :action
=>'my_action', :ruby => 'yes'}, :method => :post)%></td>
<td class="ror_rocks"><%= radio_button :form,:ruby,:yes, :onclick =>
remote_function(:url => {:controller => '/my_controler', :action
=>'my_action', :ruby => 'no'}, :method => :post)%></td>
</tr>
<tr>
<div id="my_id">
  <%= render :partial => 'yes' %>
</div>
</tr>

And the partial yes:
<% if @ruby -%>
<tr>
<td>bla bla bla ../..</td>
</tr>
<% end -%>

With the rjs
page.replace_html 'my_id', :partial => 'yes'


Thanks!

--
,========================.
| Pierre-Alexandre Meyer |
| email : pam@mouraf.org |
`========================'
8dad1ec4d769734583f45fbbee5cd009?d=identicon&s=25 Jeff Pritchard (jeffpritchard)
on 2007-02-28 17:07
Pierre-Alexandre Meyer wrote:
> Hi,
>
> I have a tabular (it's a form actually) with text_fields and buttons.
> I wanted to diplay a particular row when a button is set to 'yes'.
> Everything's working fine except, that my new row is diplayed at the top
> of the array and not where I want. I can do page.add_html/delete and
> specify bottom, but I don't understand why my snippet doesn't work.
>

Hi Pierre,
This looks perfectly correct to me.  I do something similar but with an
unordered list, and div's around each of the <li> lines.  replace_html
cleanly replaces just the line I want to change.  I wonder if it is just
a bug related to tables.  I almost never use a table anymore now that
I've learned css.

best of luck,
jp
28c315da59bc0bc0a544ed4a75ad26e9?d=identicon&s=25 Pierre-Alexandre Meyer (Guest)
on 2007-02-28 23:12
(Received via mailing list)
Thanks for your reply.

On Wed, Feb 28, 2007 at 05:07:46PM +0100, Jeff Pritchard wrote :
> This looks perfectly correct to me.  I do something similar but with an
> unordered list, and div's around each of the <li> lines.  replace_html
> cleanly replaces just the line I want to change.

I have the same snippet for lists too and it works actually.

> I wonder if it is just a bug related to tables.

Maybe. I'm waiting for other replies before going deeper in this problem
to see where's the bug. I'm wondering if it is due to the 'form' fields.

> I almost never use a table anymore now that I've learned css.

Actually, I have an application displaying a whole bunch of data (think
of
thousands rows/columns of structured data). So tabulars are perfect for
me :)

Have fun,

--
pam
2b891e820c238ded365d035771603f21?d=identicon&s=25 Bill Walton (Guest)
on 2007-03-02 02:04
(Received via mailing list)
Hi Pierre,

Pierre-Alexandre Meyer wrote:

>> I wonder if it is just a bug related to tables.
>
> Maybe. I'm waiting for other replies before going deeper in this problem
> to see where's the bug. I'm wondering if it is due to the 'form' fields.

It's not a bug with tables.  Ajax works on XHTML DOM elements.  Tables
use a
different DOM.  The explanation of the situation is on MSDN.  If you're
going to use Ajax, you're either going to use CSS, or you're going to
end up
with some very ugly code because <tr>'s can't be updated / replaced.  If
you
really need to use tables, the best way I've heard of is to replace your
<table>
  <tr></tr>
  <tr></tr>
</table>

structure with

<table>
  <tbody>
    <tr></tr>
  </tbody>
  <tbody>
    <tr></tr>
  </tbody>
</table>

It seems you can do a page.replace on a <tbody>.  I haven't tried it.
My
recommendation is to bite the bullet and learn a little CSS.  You can
use
absolute positioning on an <li> to get the table effect very easily,
your
code will be lots cleaner, and you can style the result in ways you'll
never
be able to with a table.  OTOH, I hear the XHTML DOM is going to be
extended
and CSS3.x is going to include tables.  If you can wait ;-)

Best regards,
Bill
A2c85dc5ee81b12e3cc0a6522e8d079d?d=identicon&s=25 Chris Hall (au5lander)
on 2007-09-17 13:20
(Received via mailing list)
<tr>
<div id="my_id">
 <%= render :partial => 'yes' %>
</div>
</tr>

the above is not valid html.  applying your partial, it's even more
invalid.

<tr>
<div id="my_id">
 <tr>
   <td>...</td>
  </tr>
</div>
</tr>

that's not going to work and your browser will screw up the rendering,
but you already know that.


try:

<tr id="my_id"><%= render :partial => 'yes' -%></tr>

And the partial yes:
<% if @ruby -%>
<td>bla bla bla ../..</td>
<% end -%>

rjs stays the same

keep in mind the # of td's in your partial should be the same as the
rest of the table, or have a colspan attribute.
28c315da59bc0bc0a544ed4a75ad26e9?d=identicon&s=25 Pierre-Alexandre Meyer (Guest)
on 2007-09-25 23:05
(Received via mailing list)
On Wed, Feb 28, 2007 at 07:12:45PM -0600, Bill Walton wrote :
> Hi Pierre,

Hi!

> It seems you can do a page.replace on a <tbody>.  I haven't tried it.

Unfortunately, it doesn't work either :'( I will forget about this AJAX
trick.

> My recommendation is to bite the bullet and learn a little CSS.  You can use
> absolute positioning on an <li> to get the table effect very easily, your
> code will be lots cleaner, and you can style the result in ways you'll never
> be able to with a table.

You're probably right, but at this point on I don't have the time to
learn
CSS and replace the 200 tables of my application ;) Maybe in the RC2...

>  OTOH, I hear the XHTML DOM is going to be extended
> and CSS3.x is going to include tables.  If you can wait ;-)

I'm pretty sure my customers can't wait!

Thanks for your explanation,

++

--
,========================.
| Pierre-Alexandre Meyer |
| email : pam@mouraf.org |
`========================'
28c315da59bc0bc0a544ed4a75ad26e9?d=identicon&s=25 Pierre-Alexandre Meyer (Guest)
on 2007-09-25 23:09
(Received via mailing list)
On Wed, Feb 28, 2007 at 08:34:31AM -0500, Chris Hall wrote :
> try:
>
> <tr id="my_id"><%= render :partial => 'yes' -%></tr>

It works! Thanks a lot!

> keep in mind the # of td's in your partial should be the same as the
> rest of the table, or have a colspan attribute.

Actually the colspan was already there ;)

Have fun,

--
,========================.
| Pierre-Alexandre Meyer |
| email : pam@mouraf.org |
`========================'
This topic is locked and can not be replied to.