kevind
Posts: 251
|
| Posted: 10/22/2008, 7:37 AM |
|
Hi,
I'm trying to create a section in a form which can be accordianed to save space, hiding some non-essential fields until the user wishes to view/edit them. Inside the form i have a section like this:
(...more form rows above...)
<div id="extrainfo" style="display:none;">
<tr class="Controls">
<th>Address</th>
<td><textarea name="{Address_Name}" cols="50">{Address}</textarea></td>
</tr>
</div>
(...more form rows below...)
i use want to use JQuery slideToggle() to hide/show the div surrounding the controls (multiple)
is this possible - the div in the middle of a form and hiding it programmatically - I know i can use PANELS, but want it to be immediate without page reloads.
thanks for feedback
_________________
thanks
Kevin
======================
CCS 3.2.x / ASP / MS Access /mySQL / PHP / jQuery / jQuery UI / jQuery Mobile
|
 |
 |
melvyn
Posts: 333
|
| Posted: 10/22/2008, 9:52 PM |
|
Yes, you can. In the above code you can't.
Why? Because you're inserting the table row <tr> inside a div element. Maybe work, probably got broken.
I've done it very close to yours, using jquery.
First: remember that you can assign an id to any element (table, row, list, and more) like a div. They're div too (dom elements). So, if you say <div id="xxx"></div> you can also say <table id="xxx">... or <ul id="xxx">
You can do this:
<tr class="Controls" id= "extrainfo" >
<th>Address</th>
<td><textarea name="{Address_Name}" cols="50">{Address}</textarea></td>
</tr>
You don't need the style="display:none" there. Control it with jquery:
<script language="JavaScript" type="text/javascript">
$(document).ready(function(){
$("#extrainfo").hide();
})
$("#some-div-to-fire-event").click(function(){
$("#extrainfo").toggle();
})
</script>
I've used exactly to show/hide some rows according which country has been selected. If Dominican Republic, no row, with Panama, only 2 fields, if USA, other 3 different fields, if Bahamas, only 2 fields.
One issue: you can use toggle(), hide(), show(). If using toggle("slow") or "fast" or whatever, will show or hide and will got broken, unformatted.
Try the code and tell me if need more help.
Melvyn Perez
www.purocodigo.com
_________________
Melvyn Perez
Puro Codigo
http://purocodigo.com |
|
|
|
|
