How to delete a row without Ajax request

Using jQuery DataTables 1.9.4, I simply post row ID to server and when it's deleted from the database and comes back to ajax success() function I use fnDeleteRow() row function to delete this row from the table.

But this triggers fnDraw() function init and makes an Ajax request to the server that is unnecessary.

How can I simply delete this row and arrange table on client side ?

confirmDelete = function()
{
    var data = {
        "rowid_":rowid
    };

    $.ajax({
        url:"../../Controller/ObjectController.php5",
        type:"POST",
        dataType: "json",
        data: data,
        success: function(data) {
            debugger
            if(data.Success)
            {
                    tableObjects.fnDeleteRow($("#tr_"+rowid),function(){
                        event.theme ='lime';
                        event.heading ='<i class=\'fa fa-check\'></i> Process Completed';
                        event.message ='Row deleted successfully.';
                        ntf(event);
                    });
            }

here is my taable definition:

var tableObjects = $("#objectTable").DataTable({
        "bProcessing": false,
        "bServerSide": true,
        "sAjaxSource": "../../Controller/ObjectController.php5",
        "aoColumns": [
            { "mDataProp": "NAME"},
            { "mDataProp": "TYPE"},
            { "mDataProp": "IP"},
            { "mDataProp": "REMARK"},
            {"mDataProp": "btnEdit"},
            {"mDataProp": "btnDelete"}
        ],
        "fnServerData": function (sSource, aoData, fnCallback){
            aoData.push({"name":"tablename","value":"objects"})
            debugger
            $.ajax({
                "dataType": "json",
                "contentType": "application/json; charset=utf-8",
                "type": "GET",
                "url": sSource,
                "data": aoData,
                "success": function(result){
                    policyCount = result["iTotalRecords"];
                    $.each(result.aaData, function(index,value){
                        result.aaData[index]["btnEdit"] ="<a id=\"btnEdit\" class=\"btn btn-sm btn-success\" style=\"border-radius:4px\" onclick=\"fillFormwithDatasforEdit('"+value.NAME+"','"+value.REMARK+"','"+value.TYPE+"','"+value.IP+"')\" href=\"#mdlObjects\" data-toggle=\"modal\"><i class=\"fa fa-edit\"></i> Edit </a>";
                        result.aaData[index]["btnDelete"] ="<a class=\"btn btn-sm btn-danger\" href=\"#basic\" style=\"border-radius:4px\" onclick=\"setModalTitle('"+value.NAME+"','DeleteObject')\" data-toggle=\"modal\"><i class=\"fa fa-trash-o\"></i> Delete </a>";
                        result.aaData[index]["REMARK"] ="<a class=\"btn btn-sm btn-info\" style=\"border-radius:4px\" onclick=\"setremark('"+value.NAME+"','"+ value.REMARK +"')\" data-toggle=\"modal\" href=\"#full\"><i class=\"fa fa-comment\"></i> Remark</a>";
                    });
                    fnCallback(result);
                },
                error: function (xhr, textStatus, error){
                    if (typeof console == "object") {
                        console.log(xhr.status + "," + xhr.responseText + "," + textStatus + "," + error);
                    }
                }});
        },

        "oLanguage": {
            "sLengthMenu": '<select>' +
            '<option value="5">5</option>' +
            '<option value="10">10</option>' +
            '<option value="20">20</option>' +
            '<option value="30">30</option>' +
            '<option value="40">40</option>' +
            '<option value="50">50</option>' +
            '</select> Show'
        },
        "fnCreatedRow": function( nRow, aData, iDataIndex ) {
            objectname = aData["NAME"];
            newRowID = "tr_" +objectname;
            $(nRow).attr('id', newRowID);
            $(nRow).find('td').each (function(index) {
                newRowID = index==0?objectname+"_objectname":index==1?objectname+ "_type"
                    :index==2?objectname+"_ipaddress":index==3?objectname+"_btnremark"
                    :index==4?objectname+ "_btnedit":index==5?objectname+"_btndelete":"";
                $(this).attr('id', newRowID);
            });
        },
        "fnDrawCallback": function(){
        },
        "aaSorting": [
            [2, 'asc']
        ],
        "aLengthMenu": [
            [5, 15, 20, -1],
            [5, 15, 20, "All"] // change per page values here
        ],
        "iDisplayLength": 5
    });

Client-side processing mode

In client-side processing mode ("bServerSide": false), fnRowDelete() doesn't trigger Ajax request.

See this JSFiddle for demonstration. Look for Request in the console when the request is made.

Server-side processing mode

However, in server-side processing mode ("bServerSide": true), fnRowDelete() will trigger Ajax request.

Notes

API method fnRowDelete() has a third optional boolean argument that determines whether table should do a redraw. For example:

oTable.fnRowDelete(0, function(){ console.log('Deleted'); }, false);

If re-draw is not request, you would be responsible to re-draw the table yourself later with fnDraw() which also accepts optional boolean argument that determines whether to re-filter and resort the table before the draw. For example: