Forum: Ruby on Rails How To ??? change class of DIV

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.
2b891e820c238ded365d035771603f21?d=identicon&s=25 Bill Walton (Guest)
on 2006-04-08 20:41
(Received via mailing list)
I'm trying to replicate the "green-bar" effect used in the Depot app
using Ajax.  And I'm almost there ;-)  I'm about to set off on the last
stage and would appreciate any advice that would set me off in the right
direction.

On the page, each record is represented by a <div>.  Each <div> has id =
"item#{record.id}" with class = either Listline0 or Listline1 which are
defined in my stylesheet to be of different colors.  Each <div> three
<span>s inside.  One of the <span>s has a link_to_remote to 'delete' the
item.  When the link gets used, the record gets deleted from the db and
the <div> gets deleted from the DOM.

When the user deletes an item, it screws-up the green-bar effect.  I
expected that.  And I figured there'd be a Rails (i.e., simple) way to
go through the set of remaining <div>s (preferrably from the point of
deletion down) and reset the class= to fix the effect.  I can't find it.

I see that I can use replace to basically over-write the <div> but I
can't find any way to *read* the content of the <div>.  Without that,
since link_to_remote to 'delete' the ingredient has to have the record
id, I can't see any way to use Ajax to correct the green-bar effect.
That doesn't seem right.  That is, I'll bet I'm wrong and that one of
you can point me to the piece I'm missing.  Sure would appreciate it.

Thanks in advance for any help,
Bill
41e1579600683eed6c00af9a425268e6?d=identicon&s=25 Edward Frederick (Guest)
on 2006-04-09 01:16
(Received via mailing list)
Hi Bill,

You can change the class of an element with RJS:

page << "$('#@item_id').className = '#{some_condition ? 'Listline0' :
'Listline1'}';"

Just iterate over the items you want to update.


--
Ed Frederick - edwardfrederick.com
This topic is locked and can not be replied to.