Friday, 16 December 2016

Dynamic Row Addition Delete Row from Ajax


// code is use to create dynamic Row in the Table And call it on Html Button //


 $(document).ready(function () {
        var msg = '';
        $('.addRow').click(function () {

            var row = $(this).closest('table').children('tbody').children('tr:last');
            var temp = row.clone();
            temp.find("input").val("");
            var dataAttr = temp.find("td");
            var srNo = parseInt(dataAttr[0].textContent) + 1;
            dataAttr[0].textContent = srNo;
            var lastRow = $(this).closest('table').children('tbody').children('tr:last');
            temp.insertAfter(lastRow);

        });
 });

// code is use to Remove dynamic Row in the Table And call it on Html Button //

    $(document).ready(function () {
             var msg = '';
         $('.delRow').click(function () {
            var rows = $(this).closest('table').children('tbody').children('tr');
            var row = $(this).closest('table').children('tbody').children('tr:last');
            if (rows.length > 2) {
                var dataAttr = row.find("td");
                srNo = parseInt(dataAttr[0].textContent) - 1;
                row.remove();
            } else {
                alert("Cannot delete all rows.")
            }

        });
 });

No comments:

Post a Comment