Javascript 网格刷新（）{ $.ajax（#APPLICATION.site_prefix#/_global/ajax/ajax_handlers.cfm）{ 数据类型：“json”， 完成：函数（xhr）{ 更新_data=eval（xhr.responseText）； updateGridView（）； } }) }

只需调用grid_refresh（）函数。

谢谢。尽管它确实显示新数据，但它会删除整个网格（不仅仅是数据）并创建一个新网格。这意味着在显示新数据（网格）时（如原始帖子中所述），排序和列重新排序不会保留。尽管如此，我还是非常感谢你的帮助！

$(function(){

    //update the grid when select values change
    $('#qol_options :input').change(function(){
        update_grid_data();
    });


    init_grid = function(){

        // set grid options 
        var grid;
        var columns = [
            {id: "village", name: "Village", field: "village", sortable: true},
            {id: "setting", name: "Setting", field: "setting", sortable: true},
            {id: "hood", name: "N.hood", field: "hood", sortable: true},
            {id: "timespan", name: "Time", field: "timespan", sortable: true},
            {id: "count_0", name: "0", field: "count_0", sortable: true, width: 10},
            {id: "count_1", name: "1", field: "count_1", sortable: true, width: 10},
            {id: "count_2", name: "2", field: "count_2", sortable: true, width: 10},
            {id: "count_3", name: "3", field: "count_3", sortable: true, width: 10},
            {id: "count_4", name: "4", field: "count_4", sortable: true, width: 10},
            {id: "count_6", name: "6", field: "count_6", sortable: true, width: 10},
            {id: "count_7", name: "7", field: "count_7", sortable: true, width: 10},
            {id: "count_8", name: "8", field: "count_8", sortable: true, width: 10},
            {id: "count_total", name: "Total", field: "count_total", sortable: true},
            {id: "pos_perc", name: "%", field: "pos_perc", sortable: true},
            {id: "decile", name: "Decile", field: "decile", sortable: true},
        ];

        var options = {
            enableCellNavigation: true,
            enableColumnReorder: true,
            multiColumnSort: true
        };

        //get default grid data (all)
        var grid_data = [{'village':0, 'setting':0, 'hood':0, 'timespan':0, 'count_0':0, 'count_1':0, 'count_2':0, 'count_3':0, 'count_4':0, 'count_6':0, 'count_7':0, 'count_8':0, 'count_total':0, 'pos_perc':0, 'decile':0}]; 

        //create the grid instance
        this_grid = new Slick.Grid("#data_table_container", grid_data, columns, options);

        update_grid_data();
    }


    update_grid_data = function(){
        var settingID = $('#settingID').val();
        var villageID = $('#villageID').val();
        var hoodID = $('#hoodID').val();

        //init the grid
        $.ajax({
            type: "POST",
            url: '<cfoutput>#APPLICATION.site_prefix#</cfoutput>/_global/ajax/ajax_handlers.cfm',
            data: {'action': 'get_qol_report_data', 'villageID': villageID, 'settingID': settingID, 'hoodID': hoodID, 'itemID': 0, 'categoryID': 0},
            dataType: 'json',

            success: function(data) {
                push_data_to_grid(data);
            }
        });
    }


    push_data_to_grid = function(data){
        this_grid.setData(data);
        this_grid.render();
    }

    //execute the grid init 
    init_grid();
});

<div id="myGrid" style="width:100%;height:680px;"></div>

// Display some Market Indexes on a bar on top of the Grid 
function populateMyGrid() {
    // empty out the Grid before refreshing the data
    $('#myGrid').empty();

    // columns & options definition....
    columns = [ 
        { id: "village", ............
    ];
    options = {
       enableCellNavigation: true,              
        editable: true,
        ............
    };

    ajaxURL = 'myPhpAjaxFileToPullData.php?action=getdata';

    $.getJSON(ajaxURL, function (ServerResponse) {
        dataView = new Slick.Data.DataView();
        grid = new Slick.Grid('#myGrid', dataView, columns, options);
        ............

        // initialize the model after all the events have been hooked up
        dataView.beginUpdate();
        dataView.setItems(ServerResponse.data);
        dataView.endUpdate();

        // Refresh the data render, if user only clicked on the refresh button instead of refreshing the whole page from browser 
        grid.updateRowCount();
        grid.render();
    }); // end of getJSON        
} // end of populateMyGrid

//init the grid
$.ajax({
    type: "POST",
    url: '<cfoutput>#APPLICATION.site_prefix#</cfoutput>/_global/ajax/ajax_handlers.cfm',
    data: {'action': 'get_qol_report_data', 'villageID': villageID, 'settingID': settingID, 'hoodID': hoodID, 'itemID': 0, 'categoryID': 0},
    dataType: 'json',
    success : getData
});

function getData() {
    dataView = new Slick.Data.DataView();
    grid = new Slick.Grid('#myGrid', dataView, columns, options);
    ............

    // initialize the model after all the events have been hooked up
    dataView.beginUpdate();
    dataView.setItems(ServerResponse.data);
    dataView.endUpdate();

    // Refresh the data render, if user only clicked on the refresh button instead of refreshing the whole page from browser 
    grid.updateRowCount();
    grid.render();
}

function updateGridView(){
  data_view.beginUpdate();
  data_view.setItems(update_data);
  data_view.endUpdate();
  data_view.refresh();
  grid.invalidate();
}
function grid_refresh(){
$.ajax("<cfoutput>#APPLICATION.site_prefix#</cfoutput>/_global/ajax/ajax_handlers.cfm",{
  dataType : "json",
  complete: function(xhr){
      update_data = eval(xhr.responseText);
      updateGridView();
  }
})
}