Question

我有一个类似于telerik demo的角度剑道网格。

主网格：

$scope.mainGridOptions = {
        dataSource: {
            transport: {
                read: queryurl
            },
            pageSize: 5,
        },
        sortable: true,
        pageable: true,
        detailTemplate: kendo.template($("#template").html()),
        dataBound: function () {
            this.expandRow(this.tbody.find("tr.k-master-row").first());         
        }
    }

详情网格：

$scope.detailGridOptions = function (item) {
        return {
            dataSource: {
                transport: {
                    read: detailsUrl
                },
            },
            change: $scope.showDocument,
            selectable: "row",
            dataBound: function (e) {
                var row = e.sender.tbody.find("tr:first");
                row.addClass("k-state-selected"); 
                row.trigger("change") //doesnt work!
            }
        }
    }

当用户单击详细信息网格中的行时，文档将在jquery对话框中呈现。这一切都按预期工作。当网格加载时，第一个主行被扩展。现在我需要自动触发detailsgrid中第一行的change事件，以便在应用程序加载时自动显示第一个条目的第一个文档。

由于我能够突出显示第一个细节，我认为我可以触发这样的更改事件：

row.trigger("change")

但这似乎不起作用。

非常感谢任何想法！

Answer 1

尝试使用网格的select方法选择行，而不是手动添加"k-state-selected"类。它会自动为您触发change事件。 JsBin example

(function() {
  'use strict';
  var grid = $('#grid').kendoGrid({
    dataSource: [
      { name: 'Brett', age: 37 },
      { name: 'Susan', age: 38 }
    ],
    selectable: 'row',
    change: function (e) {
      console.log('change triggered');
    },
    dataBound: function (e) {
      var row = this.tbody.find('tr:first');
      this.select(row);
    }
  }).data('kendoGrid');
})();

在kendo详细信息网格中自动触发更改事件

1 个答案: