Question

我需要循环读取带有子项的所有行以检查复选框的状态，在此igHierarchicalGrid中，我具有4级，我找不到一种逐一读取所有行和子项的最佳方法

我已经尝试过getInfo（），但是此功能仅使我进入igHierarchicalGrid的主级别

function getInfo() {   
  var $grid = $("#grid");
  var RowSelected = $("#grid").igHierarchicalGrid("option", "dataSource");

  for (var i = 0; i < RowSelected.length; i++) {
    var cell = $grid.igGrid("cellAt", 1, i)
    var $checkBox = $(cell.children[0]);
    if ($checkBox.prop("checked")) {
        updatetrue(RowSelected[i].FCU_SCREEN_NAME, RowSelected[0].FCU_TYPE, RowSelected[i].FCU_PARENT_NODE, RowSelected[i].FCU_CHAILD_NODE);

    } else {
        updatefalse(RowSelected[i].FCU_SCREEN_NAME, RowSelected[0].FCU_TYPE, RowSelected[i].FCU_PARENT_NODE, RowSelected[i].FCU_CHAILD_NODE);

    }
  }
  alert("Updated Successfuly");
}

这是网格：

$("#grid").igHierarchicalGrid({
    width: "100%",

    maxDataBindDepth: 4,

    //initialExpandDepth: 4,
    dataSource: Main, //Array of objects defined above
    fixedHeaders: true,
    primaryKey: "FCU_SNO",
    autoGenerateColumns: true,
    rowExpanding: function (e, args) {

        var grid = args.owner, expandedRows, i;
        expandedRows = $(args.parentrow).closest('tbody').find('tr[state=e]');
        for (i = 0; i < expandedRows.length; i++) {
            grid.collapse(expandedRows[i]);
        }

    },
    width: '99%',
    height: '480px',
    columns: [
        { headerText: "<br/>Code", key: "FCU_SNO", dataType: "int", width: "5%", hidden: true },
        { headerText: "Status", key: "FCU_SCREEN_FLAG", dataType: "bool", width: "5%", template: mytemplate },
        { headerText: "Screen", key: "FCU_SCREEN_NAME", dataType: "string", width: "40%" },
        { headerText: "FCU_TYPE", key: "FCU_TYPE", dataType: "string",  hidden: true },
        { headerText: "FCU_PARENT_NODE", key: "FCU_PARENT_NODE", dataType: "number", hidden: true},
        { headerText: "FCU_CHAILD_NODE", key: "FCU_CHAILD_NODE", dataType: "number", hidden: true},
    ],
    autofitLastColumn: false,
    autoGenerateColumns: false,
    dataSource: Main,
    responseDataKey: "results",
    autoCommit: true,
    primaryKey: "FCU_SNO",
    dataRendered: function (evt, ui) {
        ui.owner.element.find("tr td:nth-child(4)").css("text-align", "left");
    },

    features: featuresList,
    //defaultChildrenDataProperty: "Details1",
    columnLayouts: [{
        name: "Level1",
        features: featuresList,
        childrenDataProperty: "Details1",
        autoGenerateLayouts: true,
        autoGenerateColumns: false,
        fixedHeaders: true,
        primaryKey: "FCU_PARENT_NODE",
        columns: [
            { headerText: "<br/>Code", key: "FCU_SNO", dataType: "int", width: "5%", hidden: true },
            { headerText: "Status", key: "FCU_SCREEN_FLAG", dataType: "bool", width: "5%", template: mytemplate },
            { headerText: "Screen", key: "FCU_SCREEN_NAME", dataType: "string", width: "40%" },
            { headerText: "FCU_TYPE", key: "FCU_TYPE", dataType: "string", hidden: true },
            { headerText: "FCU_PARENT_NODE", key: "FCU_PARENT_NODE", dataType: "number", hidden: true },
            { headerText: "FCU_CHAILD_NODE", key: "FCU_CHAILD_NODE", dataType: "number", hidden: true },
        ],
        columnLayouts: [
            {
                name: "Level2",
                features: featuresList,
                childrenDataProperty: "Details2",
                autoGenerateLayouts: true,
                autoGenerateColumns: false,
                primaryKey: "FCU_PARENT_NODE",
                columns: [
                    { headerText: "<br/>Code", key: "FCU_SNO", dataType: "int", width: "5%", hidden: true },
                    { headerText: "Status", key: "FCU_SCREEN_FLAG", dataType: "bool", width: "5%", template: mytemplate },
                    { headerText: "Screen", key: "FCU_SCREEN_NAME", dataType: "string", width: "40%" },
                    { headerText: "FCU_TYPE", key: "FCU_TYPE", dataType: "string", hidden: true },
                    { headerText: "FCU_PARENT_NODE", key: "FCU_PARENT_NODE", dataType: "number", hidden: true },
                    { headerText: "FCU_CHAILD_NODE", key: "FCU_CHAILD_NODE", dataType: "number", hidden: true },
                ],
                columnLayouts: [
                    {
                        name: "Level3",
                        features: featuresList,
                        childrenDataProperty: "Details3",
                        autoGenerateLayouts: true,
                        autoGenerateColumns: false,
                        primaryKey: "FCU_PARENT_NODE",
                        columns: [
                            { headerText: "<br/>Code", key: "FCU_SNO", dataType: "int", width: "5%", hidden: true },
                            { headerText: "Status", key: "FCU_SCREEN_FLAG", dataType: "bool", width: "5%", template: mytemplate },
                            { headerText: "Screen", key: "FCU_SCREEN_NAME", dataType: "string", width: "40%" },
                            { headerText: "FCU_TYPE", key: "FCU_TYPE", dataType: "string", hidden: true },
                            { headerText: "FCU_PARENT_NODE", key: "FCU_PARENT_NODE", dataType: "number", hidden: true },
                            { headerText: "FCU_CHAILD_NODE", key: "FCU_CHAILD_NODE", dataType: "number", hidden: true },
                        ],

                    }
                ]
            }
        ]
    }]
});

Answer 1

igHierarchicalGrid API提供了一种名为allChildrenWidgets的方法，该方法将为您提供所有已创建的所有子窗口小部件的数组。请注意，当用户扩展给定行时，父网格会动态创建此类实例，而不是针对父网格中所有当前可见的行。

这意味着如果只扩展了一行，则调用allChildrenWidgets将返回一个具有单个widget实例的数组。一旦获得此数组，就可以对其进行迭代并获取每个子网格的dataSource。此dataSource对象是初始化子网格时已使用的原始数据的转换副本，并且一旦用户选中复选框，此dataSource将被更新。您可以将其分配给变量，如下所示：

let currentChild = $("#hierarchicalGrid").igHierarchicalGrid('allChildrenWidgets')[0]

请注意最后的“ [0]”-这是因为allChildrenWidgets返回一个数组。如果在for循环中使用它，则可以用一些动态索引替换它。

现在，我们有了对当前子网格的引用，我们可以调用其dataSource的dataView方法-这将为我们提供在此子网格中呈现的当前数据，并允许我们检查记录以便查看已检查的内容：

let currentDataView = child.dataSource.dataView();
// ….
// some custom logic for checking the records….

请注意，allChildrenWidgets返回所有子控件的 flattened 数组，其中包含所有层次结构级别–您将不必进行调用在当前子窗口小部件上递归排列，以达到其第3级子网格。

循环读取igHierarchicalGrid网格中的所有行

1 个答案: