有没有办法动态更改 JQwidget 网格列的数据源以及列名

Posted 2023-05-08

【中文标题】有没有办法动态更改 JQwidget 网格列的数据源以及列名

【英文标题】：Is there a way to dynamically change data source of JQwidget grid column as well as column names

【发布时间】：2020-07-21 03:12:37

【问题描述】：

我正在尝试根据用户选择更改一些列，方法是动态删除数组中的一些列。但是，在重新填充网格时，现有列似乎已经存在，因此在检索数据时收到错误消息，我收到列 (ExternalClientId1) 不存在的错误。 我该如何实施？

 loadgrid(fromDate,toDate, responseType, xRequests)

 //Instantiate Grid
    var loadGrid = function (fromDate = null, toDate = null,responseType = null, requestType = null) 

    $.ajax(
        url: "/Home/SearchResults",
        dataType: 'json',
        beforeSend: function () 
           $("jqxgrid").html('');
       ,
        error: function (json, textStatus, errorThrown) 
            alert(' Error :' + errorThrown);
        ,
        data: 
            fromdate: fromDate,
            toDate: toDate,
            responseType: responseType,
            requestType: requestType

        ,
        success: function (response) 
            // initailize grid

            var gridData = response;
            window.searchData = response.SearchResults;

            var gridSource =
            
                localdata: gridData,
                datatype: 'json'
            ;
            var gridDataAdapter = new $.jqx.dataAdapter(gridSource);

            var externalClients = [

                 text: 'ID', datafield: 'ID', width: 100 ,
                 text: 'Request Type', datafield: 'RequestType', width: 100 ,
                 text: 'First Name', datafield: 'FirstName', width: 200,
                 text: 'Last Name', datafield: 'LastName', width: 200 ,
                 text: 'ExternalClientId1', datafield: 'ExternalClientId1', width: 250 ,
                  text: 'IntakeStatus', datafield: 'IntakeStatus', width: 100 ,
                 text: 'RequestDate', datafield: 'RequestDate', width: 250 ,
                 text: 'Message', datafield: 'Message', width: 150 

            ];
            var litigationcol =  text: 'Litigation', datafield: 'Litigation', width: 150 ;
            var sublitcol =  text: 'Litigation', datafield: 'SubLitigation', width: 150 ;
            if (requestType == "xRequests") 
                externalClients.splice(4, 1);

                externalClients.splice(4, 0, litigationcol);
                externalClients.splice(5, 0, sublitcol);
            

            $("#jqxgrid").jqxGrid(
                

                    width: 1150,
                    source: gridDataAdapter,
                    pageable: true,
                    autoheight: true,
                    columnsresize: true,
                    pagesize: 20,
                    selectionmode: 'singlecell',
                    columns: externalClients
                );

      
            

【参考方案1】：

也许你可以销毁表 [ $("#jqxgrid").jqxGrid('destroy'); ] 并使用新的列信息再次重建它...您可以使用 ajax 或类似的方式获取列信息。