How to refresh datatable after AJAX Success

How to refresh datatable after AJAX Success

indralangindralang Posts: 1Questions: 1Answers: 0

Hi, I have question how to refresh datatable after AJAX Success.
Here is the idea:

I have datatable with Delete Button. Delete button will call Controller and delete the selected data and return the data in JSON.
After Success, I want the AJAX refresh the datatable. But still no answer, please help me.
This is my Jquery:

function DeleteDetail(intLine)
{
var modelHeader = {
"intID": $('#@Html.IdFor(m => m.Header.intID)').val(),
"txtField1": $('#@Html.IdFor(m => m.Header.txtField1)').val(),
"txtField2": $('#@Html.IdFor(m => m.Header.txtField2)').val(),
};

    var modelDetail = @Html.Raw(JsonConvert.SerializeObject(Model.Detail));

    $.ajax({
        url: '/Sample/DeleteDetail',
        type: 'POST',
        datatype: 'JSON',
        contentType: 'application/json',
        data: JSON.stringify(
            {
                objHeader : modelHeader,
                objDetail : modelDetail,
                intLine : intLine
            }),
        cache: false,
        success: function (data) {
            debugger;
            var objJson = JSON.parse(data);

            var table = $("#tbDataTable").dataTable();

            oSettings = table.fnSettings();

            table.fnClearTable(this);

            for (var i=0; i < objJson.detail.length; i++)
            {
                table.oApi._fnAddData(oSettings, objJson.detail[i]);
                //this part always send error DataTables warning: table id=tbDataTable - Requested unknown parameter '0' for row 0.
            }

            oSettings.aiDisplay = oSettings.aiDisplayMaster.slice();
            table.fnDraw();

            },
        error: function (data) {
            console.log(data);
        }
    });
}

I don't know why it always send me error. Please help me.

This discussion has been closed.