javascript - Put dynamic table on chained select box using jQuery -


i have form purchase requisition , created 3 chained select box (category, subcategory, product description) reference create chained select boxes website http://www.yourinspirationweb.com/en/how-to-create-chained-select-with-php-and-jquery/ problem want request many products question how? , want put of requested in database. somehow found codes used javascript working row first row only. when select eg. category: office supplies of subcategory select box(rows) affected. here code:

<html> <head> <script type="text/javascript"  src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>  <script type="text/javascript">  $(document).ready(function(){     $("select#type").attr("disabled","disabled");        $("select#category").change(function(){     $("select#type").attr("disabled","disabled");     $("select#type").html("<option>wait...</option>");     var id = $("select#category option:selected").attr('value');     $.post("select_type.php", {id:id}, function(data){         $("select#type").removeattr("disabled");         $("select#type").html(data);     });      });      $("select#desc").attr("disabled","disabled");     $("select#type").change(function(){     $("select#desc").attr("disabled","disabled");     $("select#desc").html("<option>wait...</option>");     var id = $("select#type option:selected").attr('value');     $.post("select_desc.php", {id:id}, function(data){         $("select#desc").removeattr("disabled");         $("select#desc").html(data);     });      }); $("form#select_form").submit(function(){     var cat = $("select#category option:selected").attr('value');     var type = $("select#type option:selected").attr('value');     var descr = $("select#desc option:selected").attr('value');     if(cat>0 && type>0 && descr>0)     {         var result = $("select#desc option:selected").html();         $("#result").html('your choice: '+result);     }     else     {         $("#result").html("you must choose 2 options!");     }     return false;  }); }); </script>  <script type="text/javascript">     function addrow(tableid) {      var table = document.getelementbyid(tableid);      var rowcount = table.rows.length;     var row = table.insertrow(rowcount);      var colcount = table.rows[0].cells.length;      for(var i=0; i<colcount; i++) {          var newcell = row.insertcell(i);          newcell.innerhtml = table.rows[1].cells[i].innerhtml;         //alert(newcell.childnodes);         switch(newcell.childnodes[0].type) {             case "text":                     newcell.childnodes[0].value = "";                     break;             case "checkbox":                     newcell.childnodes[0].checked = false;                     break;             case "select-one":                     newcell.childnodes[0].selectedindex = 0;                     break;         }     } }  function deleterow(tableid) {     try {     var table = document.getelementbyid(tableid);     var rowcount = table.rows.length;      for(var i=0; i<rowcount; i++) {         var row = table.rows[i];         var chkbox = row.cells[0].childnodes[0];         if(null != chkbox && true == chkbox.checked) {             if(rowcount <= 2) {                 alert("cannot delete rows.");                 break;             }             table.deleterow(i);             rowcount--;             i--;         }       }     }catch(e) {         alert(e);     } }     </script> </head> <body> <?php include "select.class.php"; ?> <form id="select_form">     <input type="button" value="add" onclick="addrow('tableid')" />      <input type="button" value="delete" onclick="deleterow('tableid')"    />  <table id="tableid">  <tr>     <td></td>     <td>category</td>     <td>subcategory</td>     <td>product description</td>         </tr>   <tr>      <td><input type="checkbox" name="chkbox[]" /></td>     <td>     <select id="category" name="category[]">         <?php echo $opt->showcategory(); ?>     </select>     </td>      <td>     <select id="type" name="type[]">          <option value="0">choose...</option>     </select>     </td>      <td>     <select id="desc" name="desc[]">          <option value="0">choose...</option>     </select>     </td>  </tr> </table>  <input type="submit" value="confirm" /> </form> <div id="result" name="result[]"></div> </body> </html> 

please need help!


Comments

Popular posts from this blog

java.util.scanner - How to read and add only numbers to array from a text file -

rewrite - Trouble with Wordpress multiple custom querystrings -