How do I toggle the display of <div> in Rails 3?
I have a within a form that contains other fields for the form. I would like the User to be able to toggle whether they see it or not.
I would like them to be able to press a button/link which would make that div appears or disappear. Ideally I could have some simple javascript effect, such slide in or fade-in.
Here is my _form:
1 <%= form_for @message do |f| %>
2 <%= f.error_messages %>
3 <p>
4 <%= f.label :subject %><br />
5 <%= f.text_field :subject %>
6 </p>
7 <p>
8 <%= f.label :body %><br /开发者_如何学JAVA>
9 <%= f.text_area :body %>
10 </p>
11 <p>
12 <div id = "contact_form">
13 <%= form_for @contact do |fc| %>
14 <p>
15 <%= fc.label :first_name %><br />
16 <%= fc.text_field :first_name %>
17 </p>
18 <p>
19 <%= fc.label :last_name %><br />
20 <%= fc.text_field :last_name %>
21 </p>
22
23 <% end %>
24 </div>
25 </p>
26 <p>
The easiest way to accomplish this is to add a link somewhere to call a script like so:
<script type="text/javascript">
function show(id) {
document.getElementById(id).style.visibility = 'visible';
}
</script>
<a href="#" onclick="show('contact_form'); return false;">show sub-form</a>
The easiest way to do this would be to use the .css rule of the jQuery javascript library:
http://api.jquery.com/css/ (See the example about a quarter down: To change the color of any paragraph to red on mouseover event.)
So using this you'd use this javascript on clicking the button/link:
$('div#contact_form').css('display', 'none');
精彩评论