Question

如果之前有人问过并回答过，请道歉。我发现很多帖子似乎都回答了这个问题，但没有一个解决方案对我有用，我无法弄清楚原因。

我正在使用JSTree（版本3）并将其更新到最新版本。我有一个div定义如下： -

    <div id="ProductInterests">  
        <ul>
            @foreach (var productGroup in ViewBag.ProductGroups)
            {
                <li class="jstree-open">@productGroup.Name
                    <ul>
                        @foreach (var product in productGroup.Products)
                        {
                            if (Model.LeadProductInterests.Any(lpi => lpi.ProductID == product.ID))
                            { 
                                <li id="@product.ID" data-jstree='{"checked":true}'>@product.Name</li>
                            }
                            else
                            { 
                                <li id="@product.ID" data-jstree='{"checked":false}'>@product.Name</li>
                            }
                        }
                    </ul>
                </li>
            }
        </ul>
    </div>

树配置如下： -

    $(function () {
        $("#ProductInterests").jstree
            ({
                core: { themes: { icons: false } },
                checkbox : { tie_selection : false },
                plugins: ["themes", "checkbox"]
            });
    });

这是生成如下所示的html： -

    <div id="ProductInterests">  
        <ul>
                <li class="jstree-open">Markiser
                    <ul>
                                <li id="1" data-jstree='{"checked":false}'>Terrassemarkise</li>
                                <li id="2" data-jstree='{"checked":false}'>Vindusmarkise</li>
                                <li id="3" data-jstree='{"checked":false}'>Semi-Nova</li>
                                <li id="4" data-jstree='{"checked":false}'>Dukskift</li>
                                <li id="5" data-jstree='{"checked":false}'>Fasademarkise</li>
                                <li id="6" data-jstree='{"checked":false}'>Kurvmarkise</li>
                                <li id="7" data-jstree='{"checked":false}'>Andre</li>
                    </ul>
                </li>
                <li class="jstree-open">Utv. Persienner
                    <ul>
                                <li id="8" data-jstree='{"checked":false}'>L50</li>
                                <li id="9" data-jstree='{"checked":false}'>Spesial</li>
                                <li id="10" data-jstree='{"checked":false}'>Variant</li>
                                <li id="11" data-jstree='{"checked":false}'>L80</li>
                    </ul>
                </li>
        </ul>
    </div>

在我的用户界面看起来很完美，我可以很好地检查和取消选中节点。

然后在我的表格提交中我有： -

    $("form").submit
    (
    function () {
        var checkedProductInterests = [];
        $("#ProductInterests").jstree("get_checked", true).forEach(function () {
            checkedProductInterests.push(this.id);
        });
        alert(checkedProductInterests.join(","));
    }
    );

我能在线找到的所有内容都应该输出显示所有选定ID的警报，但事实并非如此。它正在输出一个空白列表。我可以推断它正确地找到节点，因为它返回正确数量的空格（我计算逗号）但是id被返回为空白。

我尝试过使用这种形式：jstree（“get_checked”，false）并使用this而不是this.id但产生相同的结果。我也尝试过jstree（true）.get_checked（true）这个形式，同样的结果。

我认为我在节点上设置id的方式有问题，但它对我来说是正确的。

我错过了什么？

Answer 1

如果您拥有最新的jstree版本，这应该足够了：

$("#ProductInterests").jstree(true).get_checked().join(',');

这是一个演示（进行选择并单击按钮）：
~~http://jsfiddle.net/DGAF4/520/~~
http://jsfiddle.net/DGAF4/521/

从JSTree获取检查ID - Get_Checked查找节点但不查找ID

1 个答案: