i want show tour packages on page. put 3 tour packages more tour packages. 1. tours start res. button disabled because haven't selected room number , country.(its true) @ 2. , 3. tour start res. buttons enable. these buttons should shown disable status.
you should consider; add more tour package on page , these forms shouldn't affect each others. please me.
<!doctype html> <html> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8"> <title> - jsfiddle demo</title> <script type='text/javascript' src='http://code.jquery.com/jquery-1.5.2.js'></script> <style type='text/css'> </style> <script type='text/javascript'>//<![cdata[ $(function(){ $('#submitorder').attr('disabled', 'disabled'); function updateformenabled() { if (verifyadsettings()) { $('#submitorder').attr('disabled', ''); } else { $('#submitorder').attr('disabled', 'disabled'); } } function verifyadsettings() { if ($('#ad_duration').val() != '' && $('#ad_type').val() != '') { return true; } else { return false } } $('#ad_duration').change(updateformenabled); $('#ad_type').change(updateformenabled); });//]]> </script> </head> <body> <b>1. tour</b><br> <br> <form id="ad_form" method="post" action="../../form/form4.html"> <input type="hidden" name="code" value="tp5rmi1" /> <p> <select id="ad_type" name="ad_type"> <option value="" selected="selected">room number</option> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> </select> <label for="ad_type" class="labelstrong">how many room(s) need?</label> </p> <p> <select id="ad_duration" name="ad_duration"> <option value="" selected="selected">select country</option> <option value="gr">germany</option> <option value="fr">france</option> <option value="en">england</option> </select> <label for="ad_duration" class="labelstrong">where coming?</label> </p> <p><input type="submit" name="submit" value="start reservation" id="submitorder" /> </p> </form><br><br> ______________________________________________________________________________________________________________________<br> <br> <b>2. tour</b><br> <br> <form id="ad_form" method="post" action="../../form/form4.html"> <input type="hidden" name="code" value="tp5rmi2" /> <p> <select id="ad_type" name="ad_type"> <option value="" selected="selected">room number</option> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> </select> <label for="ad_type" class="labelstrong">how many room(s) need?</label> </p> <p> <select id="ad_duration" name="ad_duration"> <option value="" selected="selected">select country</option> <option value="gr">germany</option> <option value="fr">france</option> <option value="en">england</option> </select> <label for="ad_duration" class="labelstrong">where coming?</label> </p> <p><input type="submit" name="submit" value="start reservation" id="submitorder" /> </p> </form><br><br> ______________________________________________________________________________________________________________________<br> <br> <b>3. tour</b><br> <br> <form id="ad_form" method="post" action="../../form/form4.html"> <input type="hidden" name="code" value="tp5rmi3" /> <p> <select id="ad_type" name="ad_type"> <option value="" selected="selected">room number</option> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> </select> <label for="ad_type" class="labelstrong">how many room(s) need?</label> </p> <p> <select id="ad_duration" name="ad_duration"> <option value="" selected="selected">select country</option> <option value="gr">germany</option> <option value="fr">france</option> <option value="en">england</option> </select> <label for="ad_duration" class="labelstrong">where coming?</label> </p> <p><input type="submit" name="submit" value="start reservation" id="submitorder" /> </p> </form><br><br> </body> </html>
you have multiple elements same id. should not have multiple elements same ids on page. either have different ids or if want act them in manner, have same class name them. don't use same id across various elements.
use different ids 3 buttons , work. have them disabled in html , enable them in jquery code. like,
<input type="submit" name="submit" value="start reservation" id="submitorder1" disabled/> <input type="submit" name="submit" value="start reservation" id="submitorder2" disabled/> <input type="submit" name="submit" value="start reservation" id="submitorder3" disabled/> then enable them if conditions satisfied as,
$('#submitorder1').attr('disabled', ''); or $('#submitorder2').attr('disabled', ''); , on.
Comments
Post a Comment