You must Sign In to post a response.
  • Category: JQuery

    Add multiple records using jquery

    Hi All,

    In my application ,i want to add multiple rows from a table to database by a single click using jquery.

    following is sample table

    <table>
    <tr><td>EmpId</td><td>Ename</td><td>Dept</td><td>Salary</td></tr>
    <tr><td>1000</td><td>Arun</td>Civil<td>10000</td></tr>
    <tr><td>1001</td><td>Kiran</td>Accounts<td>5000</td></tr>
    </table>

    when a button is clicked i want to save these 2 records into database.

    how it is possible using jquery.

    Regards

    Baiju
  • #759633
    Hi

    Try below code.


    public class addToDatabase
    {
    public Int Empid { get ; set ; }
    public Int Salary { get ; set; }
    }
    < script type="text/javascript" src="http://
    ajax.googleapis.com/ajax/libs/jquery/1.8.3/
    jquery.min.js"></ script >
    < script type="text/javascript" src="http://
    cdn.jsdelivr.net/json2/0.1/json2.js"></ script >
    < script type="text/javascript">
    $( function () {
    $( "[id*=btnSave]" ).bind( "click" , function () {
    var user = {};
    user.Empid = $( "[id*=txtEmpid]" ).val();
    user.Salary = $( "[id*=txtSalary]" ).val();
    $.ajax({
    type: "POST" ,
    url: "Default.aspx/addDetails" ,
    data: '{user: ' + JSON.stringify(user) + '}' ,
    contentType: "application/json; charset=utf-8" ,
    dataType: "json" ,
    success: function (response) {
    alert( "records added" );
    window.location.reload();
    }
    });
    return false ;
    });
    });
    </ script >


    Regards.

    Sridhar Thota.
    DNS Member.
    "Hope for the best.. Prepare for the worst.."

    Sridhar Thota.
    Editor: DNS Forum.

  • #759634
    Hi sridhar ,
    thanks for your reply.
    your code is for only one row and we should know the value of textbox.my requirement is to add multiple records in a table.
    how it is possible.



    Regards
    Baiju

  • #759659
    You can try given code snippet of loop for adding multiple records in tables

    $('#btnAdd').click(function() {
    for (var x = 1; x <= $("#NumberofRows").val(); x++) {
    $('#FirstRow').clone().appendTo('#MainTable');
    }
    });

    Or, You can simply use $.append() function to add row to multiple columns in your table like

    $('#table').append('<tr><td>col </td><td>col2</td></tr>');


  • Sign In to post your comments