javascript - How to show a form if a particular radio button is selected -
i want show particular form when radio button selected. code seems work me fine except when page loads shows both forms instead of 1 form value checked in input tag
<?php function print_form() { $newform = " <body> <section> <div><strong>select quantity format</strong></div> <input type=\"radio\" id=\"radio1\" name=\"radios\" value=\"radio1\" checked onclick=\"show()\"> <label for=\"radio1\">per unit</label> <input type=\"radio\" id=\"radio2\" name=\"radios\" value=\"radio2\" onclick=\"show()\"> <label for=\"radio2\">per box</label> <form method=\"post\" id=\"unit\" action=\"{$_server['php_self']}\" > <table border=1 cellpadding=3 cellspacing=3 width='30%'> <tr> <th colspan=2 align='left' bgcolor='#eaeaea'>add medicine/item details</th> </tr> <tr> <td>medicine/item name</td> <td><input type=\"text\" name=\"medicine/item_name\"></td> </tr> <tr> <td>company name</td> <td><input type=\"text\" name=\"company_name\"></td> </tr> <tr> <td>stowage rack no.</td> <td><input type=\"text\" name=\"rack\" onkeypress=\"return isnumberkey(event)\" ></td> </tr> <tr><td colspan=2><input type=\"submit\" value=\"add record\"> <input type=\"hidden\" value=\"true\" name=\"unit\"></td></tr> </table></form> <form method=\"post\" id=\"box\" action=\"{$_server['php_self']}\" > <table border=1 cellpadding=3 cellspacing=3 width='30%'> <tr> <th colspan=2 align='left' bgcolor='#eaeaea'>add medicine/item details</th> </tr> <tr> <td>medicine/item name</td> <td><input type=\"text\" name=\"medicine/item_name\"></td> </tr> <tr> <td>company name</td> <td><input type=\"text\" name=\"company_name\"></td> </tr> <tr> <td>minimum stock (boxes)</td> <td><input type=\"text\" name=\"minimum_stock_box\" onkeypress=\"return isnumberkey(event)\"></td> </tr> <tr> <td>stowage rack no.</td> <td><input type=\"text\" name=\"rack\" onkeypress=\"return isnumberkey(event)\" ></td> </tr> <tr><td colspan=2><input type=\"submit\" value=\"add record\"> <input type=\"hidden\" value=\"true\" name=\"box\"></td></tr> </table></form> </section> <body> "; return $newform; } if(isset($_post['unit'])) { save_record_unit(); } else if(isset($_post['box'])) { save_record_box(); } else { print print_form(); } ?> the javascript used below
function show() { var radios = document.getelementsbyname("radios"); var unit = document.getelementbyid("unit"); var box = document.getelementbyid("box"); box.style.display = 'block'; for(var = 0; < radios.length; i++) { radios[i].onclick = function() { var val = this.value; if(val == 'radio1' ){ unit.style.display = 'block'; box.style.display = 'none'; } else if(val == 'radio2'){ unit.style.display = 'none'; box.style.display = 'block'; } } } }
here php function :
function show() { var radios = document.getelementsbyname("radios"); var unit = document.getelementbyid("unit"); var box = document.getelementbyid("box"); box.style.display = 'none'; for(var = 0; < radios.length; i++) { radios[i].onclick = function() { var val = this.value; if(val == 'radio1' ){ unit.style.display = 'block'; box.style.display = 'none'; } else if(val == 'radio2'){ unit.style.display = 'none'; box.style.display = 'block'; } } } }.alert{ color:white; background-color:red;padding:2em;margin:2em;}<body> <?php function print_form(){ $newform=" <section> <div><strong>select quantity format</strong></div> <input type=\"radio\" id=\"radio1\" name=\"radios\" value=\"radio1\" onclick=\"show();\" checked> <label for=\"radio1\">per unit</label> <input type=\"radio\" id=\"radio2\" name=\"radios\" value=\"radio2\" onclick=\"show();\"> <label for=\"radio2\">per box</label> <form method=\"post\" id=\"unit\" action=\"\" > <table border=1 cellpadding=3 cellspacing=3 width='30%'> <tr> <th colspan=2 align='left' bgcolor='#eaeaea'>add medicine/item details</th> </tr> <tr> <td>medicine/item name</td> <td><input type=\"text\" name=\"medicine/item_name\"></td> </tr> <tr> <td>company name</td> <td><input type=\"text\" name=\"company_name\"></td> </tr> <tr> <td>stowage rack no.</td> <td><input type=\"text\" name=\"rack\" onkeypress=\"return isnumberkey(event);\" ></td> </tr> <tr><td colspan=2><input type=\"submit\" value=\"add record\"> <input type=\"hidden\" value=\"true\" name=\"unit\"></td></tr> </table></form> <form method=\"post\" id=\"box\" action=\"\" > <table border=1 cellpadding=3 cellspacing=3 width='30%'> <tr> <th colspan=2 align='left' bgcolor='#eaeaea'>add medicine/item details</th> </tr> <tr> <td>medicine/item name</td> <td><input type=\"text\" name=\"medicine/item_name\"></td> </tr> <tr> <td>company name</td> <td><input type=\"text\" name=\"company_name\"></td> </tr> <tr> <td>minimum stock (boxes)</td> <td><input type=\"text\" name=\"minimum_stock_box\" onkeypress=\"return isnumberkey(event);\"></td> </tr> <tr> <td>stowage rack no.</td> <td><input type=\"text\" name=\"rack\" onkeypress=\"return isnumberkey(event);\" ></td> </tr> <tr><td colspan=2><input type=\"submit\" value=\"add record\"> <input type=\"hidden\" value=\"true\" name=\"box\"></td></tr> </table></form> </section> <script> show();</script>"; return $newform; } if(isset($_post['unit'])) { //save_record_unit(); echo "<div class=\"alert\">save_record_unit</div>"; } else if(isset($_post['box'])) { //save_record_box(); echo "<div class=\"alert\">save_record_box</div>"; } else { print print_form(); } ?> </body>i have placed <script> show();</script> @ end of function print_form() executed javascript each time function called php
Comments
Post a Comment