Question

对于我的项目，我需要根据用户提交的表单数据将新的子行添加到数据树的父行中。我在文档中找不到如何执行此操作的示例。是否可以使用addRow（{...}）函数？如何声明要添加子行的父级？还是我需要构建一个自定义函数，将新行插入表JSON对象并重绘表？

感谢您的帮助！

Answer 1

我使用的解决方案是将新的行对象添加到父行的_children数组的副本中，然后将更新发送到父行。为此，您需要找到父行，获取它的数据（将包括子行对象的_children数组），将新的数据行添加到_children，并更新数据表中的父行数据。

$("#add-child-row").click(function(){
    //Get values for child row form fields
    var childFields = $("#child-form").serializeArray().reduce(function(obj, item) {
        obj[item.name] = item.value;
        return obj;
    }, {});

    var newRow = {
        name: childFields.name,
        location: childFields.location,
        gender: childFields.gender,
        col: childFields.color,
        dob: childFields.dob,
    };

    //Find row to add child
    //searchRows() returns array
    //In my case, I am only expecting one matching row so use index 0
    var parentRow = table.searchRows("name","=","Oli Bob");

    //Get data for the parent row so we can update it's _children array
    var tempParentRowData = parentRow[0].getData();

    //Add new row to children array
    tempParentRowData._children.push(newRow);

    //Update data table row with new children array
    parentRow[0].update({_children:tempParentRowData._children});
});

如果您期望有大量的子行，我不知道这将如何工作。如果上述解决方案或更好的解决方案有任何缺陷，我很乐意看到。

如何在制表符中向嵌套树数据动态添加行？

1 个答案: