Question

当重新显示网格时，客户端生成的KendoUI Grid未突出显示所选行（Kendo UI Complete v2013.1.514）。

Kendoui网格位于KendoUI选项卡中（选项卡＃1）。单击第3行突出显示该行。单击第二个选项卡（选项卡＃2）隐藏网格选项卡并显示另一个网格。单击选项卡＃1时，将重新显示第一个网格并显示内容。

当单步执行选项onActivate（arg）函数时，我可以看到使用grid.select（），最后选择的行仍然是选定的行，但行没有突出显示。

我尝试使用以下代码尝试重新选择行：

var element = $(WORK_PRODUCT),
                    grid = element.data("kendoGrid"),
                    row = element.find("tbody>tr[data-uid='" + grid.dataSource.get(_selectedWorkProduct).uid + "']");

                grid.select(row);

我还检查了内部和外部HTML，并且所选行与第一次选择行时所选择的内容完全匹配（TR class = k-state-selected role = row aria-selected = true data-uid =“119b95c7 -f3e4-4160-821e-507fbdc70026" ＆GT; 7964

如何明显显示该行被选中？提前谢谢！

以下是初始化网格的代码：

DashViewUI.prototype.initWorkProducts = function (arg) {
    $(WORK_PRODUCT).kendoGrid({
        filterable: true
        , sortable: true
        , selectable: "row"
        , pageable: true
        , ajax: true                     
        , columns:
        [
            {
                field: "ID"
                , title: ""
                , sortable: true
                , hidden: true
            }
            , {
                field: "Number"
                , title: "Case No."
                , width: 80
                , sortable: true
                , filterable: true
            }
            , {
                field: "Name"
                , title: "Case Name"
                , width: 120
                , sortable: true
            }
            , {
                field: "Status"
                , title: "Status"
                , width: 70
                , sortable: true
            }
        ]
        , dataSource:
            {
                transport:
                    {
                        read:
                        {
                            url: AppPath + '/DashB/GetWorkProducts'
                            , contentType: 'application/json; charset=utf-8'
                            , type: 'GET'
                            , dataType: 'json'
                        }
                    }
                , schema: {
                    model: {
                        id: "ID"
                        , fields: {
                            "ID": { type: "number" }
                            , "Number": { type: "string" }
                            , "Name": { type: "string" }
                            , "Status": { type: "string" }
                        }
                    }
                }
            }
        , dataBound: function onDataBound(e) {
            //alert('Data bound fired');
        }
        , change: function onCaseGridChange(arg) {
            if (DEBUG)
                debugger;

            var cells = this.select();
            var name = null;

            if (cells.length > 0)
                name = this.dataItem(cells[0]);

            if (name.ID != null) {

                // store the currently selected work product
                _selectedWorkProduct = name.ID;
                // refresh the party dial gauge
                _dashViewUI.refreshDialGauge(PARTY_GAUGE, AppPath + '/DashB/GetCaseChildrenCount');

                // reload the tasks for the selected work product
                $(TASKS).data().kendoGrid.dataSource.read({ workProductID: _selectedWorkProduct });
            }
        }
    });

};

Answer 1

如果重新加载网格，则不会保留选定的网格行。你必须事先存放它。

  var selectedDataItem = grid.dataSource.getByUid(grid.select().data("uid"));
  grid.dataSource.read();

  if (selectedDataItem) {
    var uid = grid.dataSource.get(selectedDataItem.id).uid;

    grid.select('tr[data-uid="' + uid + '"]');    
  }

这是一个现场演示：http://jsbin.com/USahiPor/1/edit

当重新显示网格时，客户端生成的KendoUI网格不突出显示选定的行

1 个答案: