Quantcast
Channel: Recent Discussions — DataTables forums
Viewing all articles
Browse latest Browse all 81728

How to refresh data table, after save or update

$
0
0

I am new to programming and I have been trying this for days and still i can't get this data table to refresh after save and update. I used table.ajax.reload() function but it didn't help either.

 if ($('#Person').parsley().isValid()) {

                    var Id = $("#id").val();
                    var FirstName = $("#firstname").val();
                    var LastName = $("#lastname").val();
                    var DOB = $("#dob").val();
                    var SSN = $("#ssn").val();
                    var Email = $("#email").val();
                    var Address = $("#address").val();
                    var PhoneNo = $("#phone").val();


                    var Person = {
                        id: Id,
                        firstname: FirstName,
                        lastname: LastName,
                        dob: DOB,
                        ssn: SSN,
                        email: Email,
                        address: Address,
                        phoneno: PhoneNo
                    };

                    if (Id =="") {
                        $.ajax(
                        {
                            type: "POST",
                            url: "/Details/SavePerson",
                            data: JSON.stringify(Person),
                            contentType: "application/json; charset=utf-8",
                            dataType: "json",
                            beforeSend:function(){
                                $('#btnSubmit').attr('disabled', 'disabled');
                            },
                            success: function (data) {
                                $('#Person')[0].reset();
                                $('#btnSubmit').attr('disabled', false);
                                $('#btnSubmit').val('Submit');
                                dataTable.ajax.reload();
                                swal("Done!", "Data has been Saved.!", "success");
                                
                            }
                        }
                       );
                    }
                    else {
                        $.ajax(
                         {
                             type: "POST",
                             url: "/Details/Update",
                             data: JSON.stringify(Person),
                             contentType: "application/json; charset=utf-8",
                             dataType: "json",
                             beforeSend: function () {
                                 $('#btnSubmit').attr('disabled', 'disabled');
                             },
                             success: function (data) {
                                 $('#Person')[0].reset();
                                 $('#btnSubmit').attr('disabled', false);
                                 $('#btnSubmit').val('Submit');      
                                 swal("Done!", "Data has been Updated.!", "success");
                                 ("#persondatatable").Datatable.ajax.reload();
                             }
                         })
                    }
                    $('#Person').parsley().reset();
            }

code for my datatable is

 $(document).ready(function () {
            var dataTable;
            $.ajax({
                url: "/Details/GetAllDetails",
                type: "Get",
                datatype: "json",
                success: function (data) {

                    dataTable = $("#persondatatable").DataTable({
                        select: true,
                        data: data,
                        columnDefs: [
                            {
                                "click": false, "targets": [6],
                                "width": "24%"
                            }
                        ],
                        columns: [
                            { "data": "Id", "visible": false },
                            { "data": "Firstname" },
                            { "data": "LastName" },
                            { "data": "PhoneNo" },
                            { "data": "Email" },
                            { "data": "SSN" },
                             {
                                 "data": "Id", "render": function (data) {

                                     return '<a class="btn btn-primary" style="margin-left:30px"  onclick="editdetails(' + data + ')">Edit</a>   <a class="btn btn-danger" style="margin-left:5px; margin-right:-15x" onclick="deletedetails(' + data + ')">Delete</a>'

                                 }
                             }
                        ],

                    })

                        $('#persondatatable tbody tr').on('click', function (e) {
                            var datalist;

                            var id = dataTable.row(this).data().Id;

                            $.ajax({
                                type: 'Post',
                                url: "/Details/ViewDetails/" + id + " ",
                                success: function (data) {

                                    FirstName.textContent = data[0].Firstname,
                                    LastName.textContent = data[0].LastName,
                                    Address.textContent = data[0].Address,
                                    DOB.textContent = data[0].DOBString,
                                    Email.textContent = data[0].Email,
                                    Phone.textContent = data[0].PhoneNo,
                                    SSN.textContent = data[0].SSN
                                }
                            })
                        });
                    } 
                
            });
        })

Viewing all articles
Browse latest Browse all 81728

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>