CODEWITHSUNDEEP
jquerydatatable
user2285808
user2285808

Reputation: 53

Add row in datatable is working but edit a row or inline edit not working

i am using datatable and add dynamic row it's working but i want to edit also row but not working editing code.

var t= $('#example').DataTable({ 
         //dom: "Bfrtip",
        //ajax: "../php/staff.php",
        'fnCreatedRow': function (nRow, aData, iDataIndex) {
        $(nRow).attr('id', 'row_' + aData[0]); // or whatever you choose to set as the id
        }

$('#add_company').click(function(e){
    if(result)
    {

        t.row.add( [
            counter,
            $("#payment_company ").val(),
            $("#payment_date").val(),
            $("#payment_type").val(),
            $("#payment_amount").val()

        ] ).draw( true );

    //$('#amount_form').trigger("reset");
        counter++;
    }

Editing code is below

editor = new $.fn.dataTable.Editor( {
        //ajax: "../php/staff.php",
        table: "#example"
    } );

$('#example').on( 'click', 'tbody td:not()', function (e) {
        editor.inline( this );
    } );

Upvotes: 2

Views: 3936

Answers (1)

Aslam Patel
Aslam Patel

Reputation: 894

Use This code

var t= $('#example').DataTable({ 
         //dom: "Bfrtip",
        //ajax: "../php/staff.php",
        /*'fnCreatedRow': function (nRow, aData, iDataIndex) {
        $(nRow).attr('id', 'row_' +iDataIndex); // or whatever you choose to set as the id
        },*/
         columns: [
            { data: "s_no" },
            { data: "payment_company" },
            { data: "payment_date" },
            { data: "payment_type" },
            { data: "payment_amount"}
        ]
    });

$('#add_company').click(function(e){
    if(result)
    {
        t.rows.add( [{ "DT_RowId": "row_"+counter,
                     "s_no":counter,
        "payment_company":  $("#payment_company ").val(),
        "payment_date":   $("#payment_date").val(),
        "payment_type":  $("#payment_type").val(),
        "payment_amount":$("#payment_amount").val() }
     ] ).draw(false);

    //$('#amount_form').trigger("reset");
        counter++;
    }

and also change your inline edit code

  editor = new $.fn.dataTable.Editor( {
        //ajax: "../php/staff.php",
        table: "#example",
       fields: [ {
                label: "S.No:",
                name: "s_no"
            }, {
                label: "Payment Company:",
                name: "payment_company"
            }, {
                label: "Payment Date:",
                name: "payment_date"
            }, {
                label: "Payment Type:",
                name: "payment_type"
            }, {
                label: "Payment Amount:",
                name: "payment_amount"
            }
        ]
    } );
    // Activate an inline edit on click of a table cell
    $('#example').on( 'click', 'tbody td:not()', function (e) {
        editor.inline( this );
    } );

Upvotes: 2

Related Questions