# Hide parent element

**URL:** <https://www.ruby-forum.com/t/hide-parent-element/62034>\
**Category:** Rails\
**Created:** [May 30, 2006, 10:31pm UTC](https://www.ruby-forum.com/t/hide-parent-element/62034 "2006-05-30T22:31:28Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![subimage](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/s/aca169/32.png) [@subimage](https://www.ruby-forum.com/u/subimage)\
**Post date:** [May 30, 2006, 10:31pm UTC](https://www.ruby-forum.com/t/hide-parent-element/62034/1 "2006-05-30T22:31:28Z")

</div>

I have some code that calls a partial to display one or more blocks  
within a div tag. I want to have a close button (or cancel link) that  
will fade that block but leave the others. Here is the code:

LINK:  
\<%= link\_to\_remote “Add Miscellaneous Link”, :url =\> { :action =\>  
:add\_iyc\_link } %\>

add\_iyc\_link.rjs:  
page.insert\_html :bottom, ‘links’, :partial =\> ‘add\_iyc\_link’  
page.visual\_effect :highlight, ‘links’

\_add\_iyc\_link.rhtml:

\<%= image\_tag "cancel.png", :class =\> 'close', :onclick =\> "new Effect.Fade('iyclink', {duration: 3})" %\> Title  
 \<%= text\_field 'in\_your\_classroom\_link', 'title[]', :size =\> '30', :class =\> 'link' %\>   
 URL  
 \<%= text\_field 'in\_your\_classroom\_link', 'url[]', :size =\> '50', :class =\> 'link' %\>   
 Description [Markdown]  
 \<%= text\_area 'in\_your\_classroom\_link', 'bodytext[]', :cols =\> '70', :rows =\> '5' %\>

Can this be done? The problem is when I have two or more blocks and  
click the cancel button the first gets faded which is not the one I  
want.

---

<div class="post-metadata">

**Author:** ![subimage](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/s/aca169/32.png) [@subimage](https://www.ruby-forum.com/u/subimage)\
**Post date:** [May 31, 2006, 4:07am UTC](https://www.ruby-forum.com/t/hide-parent-element/62034/2 "2006-05-31T04:07:19Z")

</div>

The problem is that each of your

elements all have the same id. The  
javascript works with the id of elements in the DOM to do it’s thing.  
When  
it tries to do it’s thing it finds the first element with the id  
specified.

You need to specify each with a unique id.

One way would be to include a random string generation function in a  
helper. eg

def random\_id  
chars = (“A”…“Z”) + (“a”…“z”) + (“0”…“9”)  
(1…10).inject(String.new) { |str, i| str \<\< chars[rand(chars.length)] }  
end

then in your partial  
\<% rand\_id = random\_id %\>

other stuff in here

I think this should work unless you need the id to relate to the actual  
record in the db

---

<div class="post-metadata">

**Author:** ![subimage](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/s/aca169/32.png) [@subimage](https://www.ruby-forum.com/u/subimage)\
**Post date:** [May 31, 2006, 4:55pm UTC](https://www.ruby-forum.com/t/hide-parent-element/62034/3 "2006-05-31T16:55:25Z")

</div>

The weird thing is when I put \<% rand\_id = random\_id %\> in my partial  
the rjs won’t display my partial. I can take it out and it works fine.

Daniel ----- wrote:

> The problem is that each of your
> 
> elements all have the same id. The  
> javascript works with the id of elements in the DOM to do it’s thing.  
> When  
> it tries to do it’s thing it finds the first element with the id  
> specified.
> 
> You need to specify each with a unique id.
> 
> One way would be to include a random string generation function in a  
> helper. eg
> 
> def random\_id  
> chars = (“A”…“Z”) + (“a”…“z”) + (“0”…“9”)  
> (1…10).inject(String.new) { |str, i| str \<\< chars[rand(chars.length)] }  
> end
> 
> then in your partial  
> \<% rand\_id = random\_id %\>
> 
> other stuff in here
> 
> I think this should work unless you need the id to relate to the actual  
> record in the db

---

<div class="post-metadata">

**Author:** ![subimage](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/s/aca169/32.png) [@subimage](https://www.ruby-forum.com/u/subimage)\
**Post date:** [May 31, 2006, 5:37pm UTC](https://www.ruby-forum.com/t/hide-parent-element/62034/4 "2006-05-31T17:37:36Z")

</div>

Seth,

My bad… the chars line should read

chars = (“A”…“Z”).to\_a + (“a”…“z”).to\_a + (“0”…“9”).to\_a

or something similar

---

<div class="post-metadata">

**Author:** ![subimage](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/s/aca169/32.png) [@subimage](https://www.ruby-forum.com/u/subimage)\
**Post date:** [May 31, 2006, 6:04pm UTC](https://www.ruby-forum.com/t/hide-parent-element/62034/5 "2006-05-31T18:04:44Z")

</div>

Thanks Daniel. That worked.

Seth

Daniel ----- wrote:

> Seth,
> 
> My bad… the chars line should read
> 
> chars = (“A”…“Z”).to\_a + (“a”…“z”).to\_a + (“0”…“9”).to\_a
> 
> or something similar