# Hiding views before using toggle

**URL:** <https://www.ruby-forum.com/t/hiding-views-before-using-toggle/173604>\
**Category:** Rails\
**Created:** [August 11, 2009, 10:53pm UTC](https://www.ruby-forum.com/t/hiding-views-before-using-toggle/173604 "2009-08-11T22:53:32Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![cmidler](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/c/3d9bf3/32.png) [@cmidler](https://www.ruby-forum.com/u/cmidler)\
**Post date:** [August 11, 2009, 10:53pm UTC](https://www.ruby-forum.com/t/hiding-views-before-using-toggle/173604/1 "2009-08-11T22:53:32Z")

</div>

Hi, I want to hide some of my html in my view before toggling. In my  
css I tried setting the display:none; but then when I would run my  
toggle function it wouldn’t toggle. Is there an easy solution out there  
besides having to render javascript everytime to hide this html before  
toggling it?

---

<div class="post-metadata">

**Author:** ![cmidler](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/c/3d9bf3/32.png) [@cmidler](https://www.ruby-forum.com/u/cmidler)\
**Post date:** [August 12, 2009, 2:50am UTC](https://www.ruby-forum.com/t/hiding-views-before-using-toggle/173604/2 "2009-08-12T02:50:12Z")

</div>

Chase Midler wrote:

> Hi, I want to hide some of my html in my view before toggling. In my  
> css I tried setting the display:none; but then when I would run my  
> toggle function it wouldn’t toggle. Is there an easy solution out there  
> besides having to render javascript everytime to hide this html before  
> toggling it?

are you looking for a solution to your first question? hidding views

or

do you want a solution without rendering javascript?

---

<div class="post-metadata">

**Author:** ![cmidler](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/c/3d9bf3/32.png) [@cmidler](https://www.ruby-forum.com/u/cmidler)\
**Post date:** [August 12, 2009, 3:54am UTC](https://www.ruby-forum.com/t/hiding-views-before-using-toggle/173604/3 "2009-08-12T03:54:04Z")

</div>

I want to know how I can have my html text not display when a page  
loads, but still works with toggle. I.E. when using the css  
display:none; toggle does not work, but the html is hidden. When I do  
not use the css display:none; toggle does work, but the html is always  
present when I first load the page.

---

<div class="post-metadata">

**Author:** ![cmidler](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/c/3d9bf3/32.png) [@cmidler](https://www.ruby-forum.com/u/cmidler)\
**Post date:** [August 12, 2009, 3:58pm UTC](https://www.ruby-forum.com/t/hiding-views-before-using-toggle/173604/4 "2009-08-12T15:58:29Z")

</div>

Rails L. wrote:

> Make sure you are loading prototype js libraries for this page –  
> \<%= javascript\_include\_tag :defaults %\>
> 
> this example assumes you view has an image which when clicked displays a  
> hidden content and hides it when click again.
> 
> ## view
> 
> \<%= image\_tag(“blah”, :onclick=\>"$(‘abc’).toggle();")%\>
> 
> …hidden content…
> 
> ## css
> 
> #abc {  
> display:none;  
> }

Okay, so I have the javascript include tag for defaults.

I do the following in my view:

\<%= link\_to\_function(“More”) do |page|  
page.Effect.toggle(“more\_nav”)  
end%\>

 \<%more\_links.each do |text,link| -%\> - \<%= link\_to text, link %\>
 \<% end -%\> 

With this code running toggle does not work, the “more\_nav” div does not  
display. If I take out style =“display:none;” then toggle works, but  
the more\_nav html is displayed on the page when it loads.

---

<div class="post-metadata">

**Author:** ![cmidler](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/c/3d9bf3/32.png) [@cmidler](https://www.ruby-forum.com/u/cmidler)\
**Post date:** [August 13, 2009, 5:30pm UTC](https://www.ruby-forum.com/t/hiding-views-before-using-toggle/173604/5 "2009-08-13T17:30:47Z")

</div>

solved this

with my div tag under the javascript block, the display:none; css would  
not work. Moving the div above the javascript allowed this to work.

---

<div class="post-metadata">

**Author:** ![cmidler](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/c/3d9bf3/32.png) [@cmidler](https://www.ruby-forum.com/u/cmidler)\
**Post date:** [August 12, 2009, 4:20am UTC](https://www.ruby-forum.com/t/hiding-views-before-using-toggle/173604/6 "2009-08-12T04:20:53Z")

</div>

Chase Midler wrote:

> I want to know how I can have my html text not display when a page  
> loads, but still works with toggle. I.E. when using the css  
> display:none; toggle does not work, but the html is hidden. When I do  
> not use the css display:none; toggle does work, but the html is always  
> present when I first load the page.

Make sure you are loading prototype js libraries for this page –  
\<%= javascript\_include\_tag :defaults %\>

this example assumes you view has an image which when clicked displays a  
hidden content and hides it when click again.

## view

\<%= image\_tag(“blah”, :onclick=\>"$(‘abc’).toggle();")%\>

…hidden content…

## css

#abc {  
display:none;  
}