如何使用ajax请求刷新数据表

时间:2018-08-10 08:33:41

标签: jquery datatables

我有搜索表单,其结果通过ajax请求加载到JQuery数据表中。当我第一次进行搜索时,一切正常,但是当我进行更多搜索时,出现错误,表明Json响应无效。在检查器中签入,响应是页面的HTML,而不是表的json。 哪里 感谢您的任何事先帮助!

控制器

@RequestMapping(value = "/szures/letesitmeny2/eredmeny")
public @ResponseBody DataTableJsonObject<TervsorSzuresTableSurface> tervsorokSzureseLetesitmenySzuresEredmeny(
        @RequestParam(value = "tervNev", required = false) String tervNev,
        @RequestParam(value = "tervKulsoAzon", required = false) String tervKulsoAzon,
        @RequestParam(value = "tervcsoportIdList", required = false) List<Long> tervcsoportIdList,
        @RequestParam(value = "tervstatuszIdList", required = false) List<Long> tervstatuszIdList,
        @RequestParam(value = "ervenyessegKezdete", required = false) String ervenyessegKezdete,
        @RequestParam(value = "tervsorstatuszIdList", required = false) List<Long> tervsorstatuszIdList,
        @RequestParam(value = "partnerAzon", required = false) String partnerAzon,
        @RequestParam(value = "partnerNev", required = false) String partnerNev,
        @RequestParam(value = "megyeIdList", required = false) List<Integer> megyeIdList,
        @RequestParam(value = "tevekenyseg1IdList", required = false) List<Long> tevekenyseg1IdList,
        @RequestParam(value = "targyegyedidList", required = false) List<Long> targyegyedidList,
        @RequestParam(value = "tevekenyseg3IdList", required = false) List<Long> tevekenyseg3IdList,
        @RequestParam(value = "velemenyezesIdList", required = false) List<Long> velemenyezesIdList,) {

    TervsorSzuresDTO tervsorSzuresDTO = new TervsorSzuresDTO(tervKulsoAzon,tervNev, tervcsoportIdList,
            tervstatuszIdList, ervenyessegKezdete, tervsorstatuszIdList,
            tevekenyseg1IdList, targyegyedidList, tevekenyseg3IdList,
            velemenyezesIdList, megyeIdList, partnerAzon,
            partnerNev);
    DataTableJsonObject<TervsorSzuresTableSurface> dataTableJsonObject = tervsorService.getTervsorLetesitmenySzuresDTJO(tervsorSzuresDTO);
    return dataTableJsonObject;
}

jQuery:

$(document).ready( function (){
    $("#szures").click(function(){
        createTable()
        tervsorSzuresEredmeny.column(16).visible(false);
    });
});

var tervsorSzuresEredmeny;

function createTable() {
var tervNev = $('#tervNev').val();
var tervKulsoAzon = $('#tervKulsoAzon').val();
var tervcsoportIdList = $('#tervcsoportIdList').val();
var tervstatuszIdList = $('#tervstatuszIdList').val();
var ervenyessegKezdete = $('.ervenyessegKezdete').val();
var tervsorstatuszIdList = $('#tervsorstatuszIdList').val();
var tevekenyseg1IdList = $('#tevekenyseg1IdList').val();
var targyegyedidList = $('#targyegyedidList').val();
var tevekenyseg3IdList = $('#tevekenyseg3IdList').val();
var velemenyezesIdList = $('#velemenyezesIdList').val();
var megyeIdList = $('#megyeIdList').val();
var partnerAzon = $('#partnerAzon').val();
var partnerNev = $('#partnerNev').val();


//$("#table-container").show();
$("#tervsorSzuresEredmenyTable").dataTable().fnDraw();
$("#tervsorSzuresEredmenyTable").dataTable().fnDestroy();
tervsorSzuresEredmeny = $("#tervsorSzuresEredmenyTable").DataTable({
    "processing": true,
    "serverSide" : true,
    "dom": "rtiS",
    "scrollX" : true,
    "scrollY": "600px",
    "sAjaxSource": document.URL + "/eredmeny",
    "fnServerParams": function (aoData) {
        aoData.push({ "name": "tervNev", "value":  tervNev});
        aoData.push({ "name": "tervKulsoAzon", "value":  tervKulsoAzon});
        aoData.push({ "name": "tervstatuszIdList", "value":  tervstatuszIdList});
        aoData.push({ "name": "ervenyessegKezdete", "value":  ervenyessegKezdete});
        aoData.push({ "name": "tervsorstatuszIdList", "value":  tervsorstatuszIdList});
        aoData.push({ "name": "tevekenyseg1IdList", "value":  tevekenyseg1IdList});
        aoData.push({ "name": "targyegyedidList", "value":  targyegyedidList});
        aoData.push({ "name": "tevekenyseg3IdList", "value":  tevekenyseg3IdList});
        aoData.push({ "name": "velemenyezesIdList", "value":  velemenyezesIdList});
        aoData.push({ "name": "megyeIdList", "value":  megyeIdList});
        aoData.push({ "name": "partnerAzon", "value":  partnerAzon});
        aoData.push({ "name": "partnerNev", "value":  partnerNev});
    },

    columns : [ {
        "class":          "details-control",
        "orderable":      false,
        "data":           null,
        "defaultContent": ""
    }, {
        data : 'tervstatusz'
    }, {
        data : 'tervKulsoazon'
    }, {
        data : 'tervNev'
    }, {
        data : 'ervenyessegKezdete'
    }, {
        data : 'ervenyessegVege'
    }, {
        data : 'tervsorStatusz'
    }, {
        data : 'letesitmenyAzon'
    }, {
        data : 'letesitmenyNev'
    }, {
        data : 'megye'
    }, {
        data : 'telepules'
    }, {
        data : 'tevekenysegCsoport'
    }, {
        data : 'tevekenyseg'
    }, {
        data : 'altevekenyseg'
    },  {
        data : 'tervszam'
    },  {
        data : 'hasSzakterulet'
    },  {
        data : 'hasModul'
    },  {
        data : 'tervsorId'
    } ],
    "dom" : "ftipS",
    "oLanguage" : {
        "sEmptyTable" : message_properties['datatable.empty.table'],
        "sInfo" : message_properties['datatable.info'],
        "sInfoEmpty" : message_properties['datatable.info.empty'],
        "sInfoFiltered" : message_properties['datatable.info.filtered'],
        "sInfoPostFix" : "",
        "sInfoThousands" : " ",
        "sLengthMenu" : message_properties['datatable.length.menu'],
        "sLoadingRecords" : message_properties['datatable.loading.records'],
        "sProcessing" : message_properties['datatable.processing'],
        "sSearch" : message_properties['datatable.search'],
        "sZeroRecords" : message_properties['datatable.zero.records'],
        "oPaginate" : {
            "sFirst" : message_properties['datatable.paginate.first'],
            "sPrevious" : message_properties['datatable.paginate.previous'],
            "sNext" : message_properties['datatable.paginate.next'],
            "sLast" : message_properties['datatable.paginate.last']
        },
        "oAria" : {
            "sSortAscending" : message_properties['datatable.sort.asc'],
            "sSortDescending" : message_properties['datatable.sort.desc']
        }
    }

});

}

0 个答案:

没有答案