Question

我有这个加载了页面加载的sclick网格。现在我希望光滑网格上的数据被复选框上的新数据替换（我使用ajax调用来获取新数据），复选框应保留其值。我可以看到，尽管服务器提供新数据，但是光滑的网格不会刷新，并且复选框不会保留页面加载的状态（即检查）。

JSP：

onBackPressed()

光滑的网格：

 <c:if test="${info == null or empty info}">
                    <div id="result" class="ui-widget" style="float:center">
                    <strong>No results found !</strong>
                    </div>
                </c:if>

Ajax电话：

  var dataView;
      var grid;
      var data = [];
      var options = {
        enableCellNavigation: true,
        showHeaderRow: true,
        headerRowHeight: 40,
        explicitInitialization: true,
        enableColumnReorder: false,
        multiColumnSort: true,
        defaultSortAsc:false,

      };
      var columns = [];
      var columnFilters = {};
      {  
      ....
      ...

      }


          $(function () {

               var holder=new Array();
                var i=0;
                 var d = (data[i] = {});
                 <c:forEach var="message" items="${info}" >
                 holder[i]={
                            id: i,
                            remove: '<c:out value="${message.id}"/>' ,
                            name: '<c:out value="${message.name}"/>',
                            status: '<c:out value="${message.status}"/>'
                            }
                      i++; 
                  </c:forEach>

            dataView = new Slick.Data.DataView();
            grid = new Slick.Grid("#rulesGrid", dataView, columns, options);
            var pager = new Slick.Controls.Pager(dataView, grid, $("#rulesPager"));

            grid.onSort.subscribe(function (e, args){
            dataView.fastSort(args.sortCol.field, args.sortAsc);
            grid.render();
            });


            dataView.onRowCountChanged.subscribe(function (e, args) {
              grid.updateRowCount();
              grid.invalidateRows(args.rows);//new change
              grid.render();
            });



            grid.init();
            dataView.beginUpdate();
            dataView.setItems(holder);
            dataView.setFilter(filter);
            dataView.endUpdate();
            dataView.refresh();
            grid.invalidate();
            grid.updateRowCount();
            grid.render();
          });

Answer 1

在你的ajax调用中，你的成功回调函数可以包含一个＆＃39;结果＆＃39;参数，如：

success: function(result) {...

从服务器，您可以定义应该返回哪些数据＆＃39;结果＆＃39;参数（网格的新数据），使用javascript，您可以用新数据替换原始数据。

Answer 2

我找到了另一种方法，通过从服务器获取所有数据并在复选框上显示事件上的新数据（预期数据）。这种方法比最大化ajax调用更快，它还保留了复选框的状态（已选中）。这就是我这样做的方法：

   $("#showInactive").change(function(e,args) {

            if(this.checked) {

                         var holder=new Array();
                            var i=0;
                             var d = (data[i] = {});
                             <c:forEach var="message" items="${info}">
                                 holder[i]={
                                        id: i,
                                        remove: '<c:out value="${message.Id}"/>' ,
                                        rule: '<c:out value="${message.Name}"/>',
                                        status: '<c:out value="${message.status}"/>'
                                        }
                                  i++; 
                              </c:forEach>
                             grid.init();
                                dataView.beginUpdate();
                                dataView.setItems(holder);
                                dataView.endUpdate();
                                dataView.refresh();
                                grid.invalidate();
                                grid.updateRowCount();
                                grid.render();
                             grid.render();
                    });

Slick Grid没有使用Ajax调用刷新

2 个答案: