javascript - How to get input value from each td after attribute readonly applied? -
i built script clone every child rows parent typing on checkbox checked here.
it working until now. want each child input value saved ajax. last child echoed.
js
function cloneallz(clsname) { var $input1 = $('.prdedt').find('td.' + clsname + ' input[type="text"]').filter(':visible:first'); //master input //console.log($input1.attr('id'));//test master input $input1.on('input', function() { var $this = $(this); window.settimeout(function() { if ($('input.' + clsname).is(':checked')) { var $child = $('.prdedt').find('td.' + clsname + ' input[type="text"]'); $child.val($this.val()).attr('readonly', true).each(function() { //how loop each input in column??? console.log($this.attr('id')); }); $input1.attr('readonly', false); } else { $('.prdedt').find('td.' + clsname + ' input[type="text"]').removeattr('readonly', ); //remove readonly } }, 0); }); }
html
<table class="table table-bordered table-striped prdedt"> <tr> <th>id</th> <th>code <label class="pull-right label label-default"> <input type="checkbox" class="cde" onchange="cloneallz('cde')" /> <em class="fa fa-clone"></em></label> </th> <th>title <label class="pull-right label label-default"> <input type="checkbox" class="tt_en" onchange="cloneallz('tt_en')" /> <em class="fa fa-clone"></em></label> </th> <th>cost</th> </tr> <tr> <td>00067</td> <td class="cde"> <input type="text" name="prd_cde" id="prd_cde|67" class="form-control" value="3000009" /> </td> <td class="tt_en"> <input type="text" name="prd_title_en" id="prd_title_en|67" class="form-control" value="transfer krabi airport-ao nang" /> </td> <td> <input type="number" name="prd_cost" id="prd_cost|67" class="form-control" value="800" /> </td> </tr> <tr> <td>00068</td> <td class="cde"> <input type="text" name="prd_cde" id="prd_cde|68" class="form-control " value="3000009" /> </td> <td class="tt_en"> <input type="text" name="prd_title_en" id="prd_title_en|68" class="form-control " value="transfer krabi airport-ao nang " /> </td> <td> <input type="number" name="prd_cost" id="prd_cost|68" class="form-control" value="600" /> </td> </tr> </table>
so question : how echo each row input save them data via ajax???
function cloneallz(clsname) { var $input1 = $('.prdedt').find('td.' + clsname + ' input[type="text"]').filter(':visible:first'); //master input //console.log($input1.attr('id'));//test master input $input1.on('input', function() { var $this = $(this); window.settimeout(function() { if ($('input.' + clsname).is(':checked')) { var $child = $('.prdedt').find('td.' + clsname + ' input[type="text"]'); $child.val($this.val()).attr('readonly', true).each(function() { //how loop each input in column??? console.log($this.attr('id'));//only first row echoed twice! }); $input1.attr('readonly', false); } else { $('.prdedt').find('td.' + clsname + ' input[type="text"]').removeattr('readonly', ); //remove readonly } }, 0); }); }
<link href="https://netdna.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css" rel="stylesheet" /> <link href="https://netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" rel="stylesheet" /> <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <table class="table table-bordered table-striped prdedt"> <tr> <th>id</th> <th>code <label class="pull-right label label-default"> <input type="checkbox" class="cde" onchange="cloneallz('cde')" /> <em class="fa fa-clone"></em></label> </th> <th>title <label class="pull-right label label-default"> <input type="checkbox" class="tt_en" onchange="cloneallz('tt_en')" /> <em class="fa fa-clone"></em></label> </th> <th>cost</th> </tr> <tr> <td>00067</td> <td class="cde"> <input type="text" name="prd_cde" id="prd_cde|67" class="form-control" value="3000009" /> </td> <td class="tt_en"> <input type="text" name="prd_title_en" id="prd_title_en|67" class="form-control" value="transfer" /> </td> <td> <input type="number" name="prd_cost" id="prd_cost|67" class="form-control" value="800" /> </td> </tr> <tr> <td>00068</td> <td class="cde"> <input type="text" name="prd_cde" id="prd_cde|68" class="form-control " value="3000009" /> </td> <td class="tt_en"> <input type="text" name="prd_title_en" id="prd_title_en|68" class="form-control " value="transfer" /> </td> <td> <input type="number" name="prd_cost" id="prd_cost|68" class="form-control" value="600" /> </td> </tr> </table>
Comments
Post a Comment