# How to hide a toggling page element by default

**URL:** <https://www.ruby-forum.com/t/how-to-hide-a-toggling-page-element-by-default/125447>\
**Category:** Rails\
**Created:** [January 9, 2008, 6:44am UTC](https://www.ruby-forum.com/t/how-to-hide-a-toggling-page-element-by-default/125447 "2008-01-09T06:44:04Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![athem](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/a/22d042/32.png) [@athem](https://www.ruby-forum.com/u/athem)\
**Post date:** [January 9, 2008, 6:44am UTC](https://www.ruby-forum.com/t/how-to-hide-a-toggling-page-element-by-default/125447/1 "2008-01-09T06:44:04Z")

</div>

I have a link in an rhtml template:

\<%= link\_to\_remote “Edit”, :url =\> {:action =\> :toggle\_edit\_campaign}  
%\>

that executes an action to toggle a page element (edit\_campaign):

def toggle\_edit\_campaign  
render :update do |page|  
page.toggle :edit\_campaign  
end  
end

Toggling works, but the edit\_campaign element is visible by default  
when the page loads. I would like it to be hidden by default, and  
then toggle show, hide, show, hide, etc. when the above link\_to\_remote  
is clicked. How does one do this (make the element hidden by default,  
and toggle to visible on the first click)?

Thanks.

---

<div class="post-metadata">

**Author:** ![athem](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/a/22d042/32.png) [@athem](https://www.ruby-forum.com/u/athem)\
**Post date:** [January 9, 2008, 7:17am UTC](https://www.ruby-forum.com/t/how-to-hide-a-toggling-page-element-by-default/125447/2 "2008-01-09T07:17:04Z")

</div>

Hi,

If :edit\_campaign is a div you do:

content

Cheers

---

<div class="post-metadata">

**Author:** ![athem](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/a/22d042/32.png) [@athem](https://www.ruby-forum.com/u/athem)\
**Post date:** [January 9, 2008, 7:17am UTC](https://www.ruby-forum.com/t/how-to-hide-a-toggling-page-element-by-default/125447/3 "2008-01-09T07:17:23Z")

</div>

Set style=‘display:none’ on the element as an attribute.

On Jan 9, 2008 4:13 PM, athem [removed\_email\_address@domain.invalid](mailto:removed_email_address@domain.invalid) wrote:

> ```
> page.toggle :edit_campaign
> 
> ```
> 
> >

–  
Ryan B.

> **[frozenplague.net](http://www.frozenplague.net)**
>
> This domain may be for sale!

Feel free to add me to MSN and/or GTalk as this email.

---

<div class="post-metadata">

**Author:** ![athem](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/a/22d042/32.png) [@athem](https://www.ruby-forum.com/u/athem)\
**Post date:** [January 9, 2008, 5:23pm UTC](https://www.ruby-forum.com/t/how-to-hide-a-toggling-page-element-by-default/125447/4 "2008-01-09T17:23:14Z")

</div>

On Jan 8, 10:17 pm, Peter D. [removed\_email\_address@domain.invalid](mailto:removed_email_address@domain.invalid)  
wrote:

> Hi,
> 
> If :edit\_campaign is a div you do:
> 
> content
> 
> Cheers
> 
> –  
> Posted viahttp://www.ruby-forum.com/.

Worked like a charm. For anyone trying to hide a toggling div, that’s  
the solution. Thanks very much.

Here’s how the div looks: