javascript - Jquery forms with adaptive table from selector -
i need help. trying build form in php + jquery, , have trouble functionality.
example, have code:
<form action="" method="post" id="multiform"> <!-- product selector --> <table class="multi" id="multirow"> <tr><td> <select name="store[product][]" required> <option value="" selected="selected">-product-</option> <option value="430">octa</option> <option value="440">kasko</option> <option value="19041">travel</option> <option value="19063">household</option> </select> </td> <!-- /product selector --> </table> <input type="submit" value="ok"> how can that, if selected value 430 or 440, @ right side inserts
<td><input type="text" id="motor[]" name="multiarray[vehicle_type][]"></td> <td><input type="text" id="deadline[]" name="multiarray[end_date][]"></td> <td><a class="del" href="#">delete button</a></td> if selected value 19041 or 19063, inserts
<td><input type="text" id="location[]" name="multiarray[travel_location][]"></td> <td><a class="del" href="#">delete button</a></td> i need there +add button , -delete button write:
<a class="del" href="#">delete button</a> but datepicker functionality need id inputs unique, ex: id="location1" , @ next added row id="location2".
$("#productselect").change(function(){ var select = document.getelementbyid("productselect"); var selecedproduct = select.options[select.selectedindex].value; $("tr[id^='forselect']").remove(); if(selecedproduct==430 || selecedproduct==440 ) { var html ='<tr id="forselect"><td><input type="text" id="motor[]" name="multiarray[vehicle_type][]"></td>'; html +='<td><input type="text" id="deadline[]" name="multiarray[end_date][]"></td>'; html +='<td><a class="del" onclick="removetags();return false;" href="#">delete button</a></td></tr>'; html +='<tr id="forselect"><td><a href="#" onclick="adddatepicker();return false;">add datepicker </a> </td></tr>'; $("#multirow").append(html); } else if(selecedproduct==19041 || selecedproduct==19063 ) { var html ='<tr id="forselect"><td><input type="text" id="location[]" name="multiarray[travel_location][]"></td>'; html +=' <td><a class="del" onclick="removetags();return false;" href="#">delete button</a></td></tr>'; html +='<tr id="forselect"><td><a href="#" onclick="adddatepicker();return false;">add datepicker </a> </td></tr>'; $("#multirow").append(html); } }); deldatepicker = function deldatepicker(id) { $("#remove"+id).remove(); } adddatepicker = function adddatepicker() { var n = $("input[id^='location']").length;n++; var html ='<tr id="remove'+n+'"><td><input type="text"id="location'+n+'" placeholder="date"></td><td><button onclick="deldatepicker('+n+')">delete datepicker </button> </td></tr>'; $("#multirow").append(html); $("#location"+n).datepicker(); } removetags = function removetags() { $("tr[id^='forselect']").remove(); } it may you work.
Comments
Post a Comment