jquery - hide/show multiple buttons with Select menu onChange -
i not sure if can me have < select menu > onchange shows 2 different forms when toggle. problem have update button outside of form , trying change button when form changes.
below codes. can me figure out.
javascript:
hide/show
function changelocation(val) { var id = val; //alert(id); if (id == '1') { $('#tr_1').css('display', 'table-row'); $('#tr_2').css('display', 'none'); } if (id == '2') { $('#tr_2').css('display', 'table-row'); $('#tr_1').css('display', 'none'); } }
display save button out of form
$(document).ready(function () { $("#location1_update").click(function () { $("#location1").submit(); }); });
$(document).ready(function () { $("#location2_update").click(function () { $("#location2").submit(); }); });
buttons
<input class="submit-button" type="submit" name="location1_update" value="update"> <input class="submit-button" type="submit" name="location2_update" value="update">
< select menu > - using smarty note -- works fine.
<select class="selmenu-wo" name="company_locations" onchange="changelocation(this.value)"> <option value="1" selected="selected">{section name=r loop=$location1}{$location1[r].location} {/section}</option> <option value="2">{section name=q loop=$location2}{$location2[q].location} {/section} </option> </select>
forms.
<form action="" id="location1" name="location1" method="post"> <table cellpadding="0" id="tr_1" cellspacing="0"> <tr> <td><b>name</b></td> <input name="test" type="text" value="test data"> </td></tr> </table> </form> <form action="" id="location2" name="location2" method="post"> <table cellpadding="0" id="tr_2" style="display:none" cellspacing="0"> <tr> <td><b>name</b></td> <input name="test2" type="text" value="test data"> </td></tr> </table> </form>
the forms toggle fine show button when toggle well. if assign same id form , button button toggles.
use
$("#location1_update").hide()
and
$("#location1_update").show()
for hide , show button. change html whit id instead name
<input class="submit-button" type="submit" id="location1_update" value="update"> <input class="submit-button" type="submit" id="location2_update" value="update">
then js be
if (id == '1') { $('#tr_1').css('display', 'table-row'); $('#tr_2').css('display', 'none'); $("#location1_update").show(); $("#location2_update").hide(); } if (id == '2') { $('#tr_2').css('display', 'table-row'); $('#tr_1').css('display', 'none'); $("#location2_update").show(); $("#location1_update").hide(); }
Comments
Post a Comment