Read each rows before sending using jQuery -


i have following table inside form

<form>     <table id="table1" class="appendgrid ui-widget">         <thead class="ui-widget-header">             <tr>                 <td class="ui-widget-header" style="width: 32px;"></td>                 <td class="ui-widget-header">supco</td>                 <td class="ui-widget-header">number</td>             </tr>         </thead>         <tbody class="ui-widget-content">             <tr id="tblappendgrid_row_1">                 <td class="ui-widget-content first">1</td>                 <td class="ui-widget-content">                     <input type="text" id="tblappendgrid_supco_1" name="supco" maxlength="100" style="width: 160px;"></td>                 <td class="ui-widget-content">                     <input type="text" id="tblappendgrid_number_1" name="number" maxlength="4" style="width: 40px;"></td>             </tr>             <tr id="tblappendgrid_row_2">                 <td class="ui-widget-content first">2</td>                 <td class="ui-widget-content">                     <input type="text" id="tblappendgrid_supco_2" name="supco" maxlength="100" style="width: 160px;"></td>                 <td class="ui-widget-content">                     <input type="text" id="tblappendgrid_number_2" name="number" maxlength="4" style="width: 40px;"></td>             </tr>             <tr id="tblappendgrid_row_3">                 <td class="ui-widget-content first">3</td>                 <td class="ui-widget-content">                     <input type="text" id="tblappendgrid_supco_3" name="supco" maxlength="100" style="width: 160px;"></td>                 <td class="ui-widget-content">                     <input type="text" id="tblappendgrid_number_3" name="number" maxlength="4" style="width: 40px;"></td>             </tr>                    <button  role="button" class="ui-button" id="btnsave" type="button"></button>         </tbody>     </table> </form> 

i trying read each row(tr) , submit using ajax function.

$('#btnsave').button().click(function () {     var rowdata = $(document.forms[0]).serializearray();     $.each(rowdata, function (i, field) {         var odata = {             "supco": field.supco.value,             "number": field.number.value                 };                                    $.ajax({        type: 'post',        url: "./api/updatedb?id=" + id +"&",        data: odata,        sucess: alert("record udpatesucessfully.")                         });    }); 

problem having is, when try serlializearray, 1 long string , doesn't save in object. goal each row object or read nearest tr, can submit update db. ideas how can that? pleaseeeeee

you should try (assuming id want in first column) :

$('#btnsave').button().click(function () {     var rows = $('form tbody>tr');     $.each(rows, function () {         var odata = {             "supco": $(this).find('input[name="supco"]').val(),             "number": $(this).find('input[name="number"]').val()                };                                        $.ajax({             type: 'post',             url: "./api/updatedb?id=" + $(this).find('td.first').text() +"&",             data: odata,             success: alert("record udpatesucessfully.")                             });        }); }); 

but maybe better (depending of needs) send 1 single ajax request whole data of rows many of them (one row). :

$('#btnsave').button().click(function () {     var odata = {         'rows': []     };     var rows = $('form tbody>tr');     $.each(rows, function () {         odata.rows.push({             "id": $(this).find('td.first').text(),             "supco": $(this).find('input[name="supco"]').val(),             "number": $(this).find('input[name="number"]').val()                });     });     $.ajax({         type: 'post',         url: "./api/updatedb",         data: odata,         success: alert("record udpatesucessfully.")                         });  }); 

and make loop in server-side script :

foreach ($_post['rows'] $row) {     $id = $row['id'];     $supco = $row['supco'];     $number = $row['number'];     /* script */ } 

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 -