Fancytree：如何在复杂 table 中获取输入值？

Question

# this is reference picture #

我用复杂的table

$("#tree").fancytree({
checkbox: true,

.......

source: { url: "../tree-products.json"},

.......

renderColumns: function(event, data) {
    var node = data.node,$tdList = $(node.tr).find(">td");
    $tdList.eq(1).text(node.getIndexHier());
    $tdList.eq(3).find("select").val(node.data.unit);
    $tdList.eq(4).find("input").val(node.data.stusnextclassdate);
    $tdList.eq(5).find("input").val(node.data.mny);
    $tdList.eq(6).html(node.data.schedule);
}

})

以下为link供测试

test link

This is google driver download link

我的问题是......

点击按钮时，需要获取fancytree的输入值。我应该如何写这个 fancytree 语法？

我试过以下语法...

$("#tree").fancytree("getTree").getSelectedNodes() 以上语法可以得到 tree-products.json 数据。无法从 renderColumns 获取数据。

Answer 1

如果我正确理解你的问题，你需要在元素之外访问你的 fancytree 的选择。你可以通过

$("#tree").fancytree("getTree").getSelectedNodes()

这应该 return 您在 FancytreeNode 对象中的选择。

有关详细信息，请参阅 http://www.wwwendt.de/tech/fancytree/doc/jsdoc/Fancytree.html#getSelectedNodes

编辑

好的，看了你的代码，我明白你想做什么，哪里做错了。

问题出在您的 renderColumns 方法中。在

$tdList.eq(3).find("input").val(node.key);
$tdList.eq(4).find("input").val(node.data.foo);

您正在 html 元素中设置节点数据，但这不是双向绑定。当您的输入元素更改了它们的值时，您需要更新节点数据。您可以使用 javascript 个事件来做到这一点：

renderColumns: function(event, data) {
    var node = data.node;
    var row = $(node.tr);

    $tdList = row.find(">td");
    // (Index #0 is rendered by fancytree by adding the checkbox)
    // Set column #1 info from node data:
    $tdList.eq(1).text(node.getIndexHier());
    // (Index #2 is rendered by fancytree)
    // Set column #3 info from node data:
    $tdList.eq(3).find("input").val(node.key);
    $tdList.eq(4).find("input").val(node.data.foo);

    row.on("change", ".update-foo", function() {
        node.data.foo = $(this).val();
    });
}

为了使其正常工作，您需要更新 html 模板：

<tr>
    <td class="alignCenter"></td>
    <td></td>
    <td></td>
    <td><input name="input1" type="input"></td>
    <td><input class="update-foo" name="input2" type="input"></td>
    <td class="alignCenter"><input name="cb1" type="checkbox"></td>
    <td class="alignCenter"><input name="cb2" type="checkbox"></td>
    <td>
        <select name="sel1" id="">
            <option value="a">A</option>
            <option value="b">B</option>
        </select>
    </td>
</tr>

或者，您可以在按钮的点击事件中读取 html 标签，但我不推荐这样做，因为您的节点数据没有更新。

希望对您有所帮助

Fancytree：如何在复杂 table 中获取输入值？

Fancytree: How can I get input value in complex table?

javascript

php

jquery

fancytree

我用复杂的table

以下为link供测试

我的问题是......

我试过以下语法...