0

从数据库动态添加可嵌套 div 内容后遇到问题。

可嵌套的静态数据按预期工作。我可以从 nestable2 添加项目并查看序列化输出中的更改。

具有动态数据的可嵌套 失去了从可嵌套2到可嵌套的拖放功能，尽管在可嵌套中拖放似乎仍然有效。但是，更改不会反映在序列化输出中。

此外，用于可嵌套的序列化输出的动态数据版本似乎不完整。比较两个链接之间的可嵌套序列化输出表明，可嵌套动态数据链接的 JSON 对象在 Metal 类别菜单之后结束，尽管完整菜单显示在该页面上的可嵌套 div 和 tshoot innerHTML 中。

谁能指出我正确的方向来解决这个问题？

谢谢！

问题太模糊？好的，让我添加更多细节。

下面是一些从 JSON 构建可嵌套菜单的代码：

...函数构建项目（项目）{

var html = "<li class='dd-item' data-id='" + item.id + "' id='" + item.id + "'>";
html += "<div class='dd-handle'>" + item.id + "</div>";

if (item.children) {

    html += "<ol class='dd-list'>";
    $.each(item.children, function (index, sub) {
        html += buildItem(sub);
    });
    html += "</ol>";

}

html += "</li>";

return html;

}

$.each(JSON.parse(obj), function (index, item) {

$('#nestable2 ul').append(buildItem(item));

}); ...

我将硬编码版本中的列表与动态版本进行了比较，发现好的硬编码版本以 ol 标记开头，而动态版本以 ul 标记开头（由于某种原因无法在本文中提供 html）。所以我将代码更改为

...

功能构建项目（项目）{

var html = "<li class='dd-item' data-id='" + item.id + "'>";
html += "<div class='dd-handle'>" + item.id + "</div>";

if (item.children) {

    html += "<ol class='dd-list'>";
    $.each(item.children, function (index, sub) {
        html += buildItem(sub);
    });
    html += "</ol>";

}

html += "</li>";

return html;

}

$.each(JSON.parse(obj), function (index, item) {

$('#nestable2 ol').append(buildItem(item));

}); ...

并使 nestable2 div 以 ol 标记开头。

那种工作，但现在我得到了额外的孩子（例如，塑料，阀门，加热和冷却，库存夹具和杂项附加到金属。阀门，加热和冷却，库存夹具和杂项附加到塑料和库存夹具和杂项附加到加热和冷却。

很明显 if (item.children) 循环存在问题。

有没有人看到这个问题，也许是一个建议的修复？

这是有效的 JSON：

[{"id":"金属","children":[{"id":"Propress","children":[{"id":"Elbows","children":[{"id":"1 /2 90"},{"id":"1/2 45"},{"id":"3/4 90"},{"id":"3/4 45"},{"id": "1/2 LS 90"},{"id":"1/2 ST 45"}]},{"id":"三通","儿童":[{"id":"1/2 x 1 /2 x 3/4"},{"id":"1/2"},{"id":"3/4 x 1/2 x 1/2"}]},{"id":"联轴器"}]},{"id":"Copper","children":[{"id":"Elbows","children":[{"id":"1/2 90"},{"id" :"1/2 45"},{"id":"3/4 90"},{"id":"3/4 45"},{"id":"1/2 LS 90"},{"id":"1/2 ST 45"}]},{"id":"三通","儿童" :[{"id":"1/2 x 1/2 x 3/4"},{"id":"1/2"},{"id":"3/4 x 1/2 x 1/ 2"}]},{"id":"联轴器"}]},{"id":"Black","children":[{"id":"Elbows","children":[{"id" :"1/2 90"},{"id":"1/2 45"},{"id":"3/4 90"},{"id":"3/4 45"},{" id":"1/2 LS 90"},{"id":"1/2 ST 45"}]},{"id":"Tees","children":[{"id":"1/ 2 x 1/2 x 3/4"},{"id":"1/2"},{"id":"3/4 x 1/2 x 1/2"}]},{"id" :"联轴器"}]},{"id":"Brass","children":[{"id":"Elbows","children":[{"id":"1/2 90"},{"id ":"1/2 45"},{"id":"3/4 90"},{"id":"3/4 45"},{"id":"1/2 LS 90"}, {"id":"1/2 ST 45"}]},{"id":"Tees","children":[{"id":"1/2 x 1/2 x 3/4"}, {"id":"1/2"},{"id":"3/4 x 1/2 x 1/2"}]},{"id":"联轴器"}]},{"id" :"铸铁","儿童":[{"id":"弯头","儿童":[{"id":"1/2 90"},{"id":"1/2 45"} ,{"id":"3/4 90"},{"id":"3/4 45"},{"id":"1/2 LS 90"},{"id":"1/2 ST 45"}]},{"id":"三通","儿童":[{"id":"1/2 x 1/ 2 x 3/4"},{"id":"1/2"},{"id":"3/4 x 1/2 x 1/2"}]},{"id":"联轴器" }]},{"id":"Megapress","children":[{"id":"Elbows","children":[{"id":"1/2 90"},{"id": "1/2 45"},{"id":"3/4 90"},{"id":"3/4 45"},{"id":"1/2 LS 90"},{" id":"1/2 ST 45"}]},{"id":"Tees","children":[{"id":"1/2 x 1/2 x 3/4"},{" id":"1/2"},{"id":"3/4 x 1/2 x 1/2"}]},{"id":"联轴器"}]}]},{"id" ："塑料","儿童":[{"id":"管道","儿童":[{"id":"PVC"},{"id":"PEX"},{"id":"Aquatherm "}]},{"id":"PVC","children":[{"id":"Elbows","children":[{"id":"1/2 90"},{"id" :"1/2 45"},{"id":"3/4 90"},{"id":"3/4 45"},{"id":"1/2 LS 90"},{ "id":"1/2 ST 45"}]},{"id":"Tees","children":[{"id":"1/2 x 1/2 x 3/4"},{ "id":"1/2"},{"id":"3/4 x 1/2 x 1/2"}]},{"id":"法兰"},{"id":"联轴器"},{"id":"大写字母"},{"id":"Unions"},{"id":"Reducers"},{"id":"Adapters"},{"id":"Valve"}]},{"id":"PEX","children":[ {"id":"肘部","儿童":[{"id":"1/2 90"},{"id":"1/2 45"},{"id":"3/4 90 "},{"id":"3/4 45"},{"id":"1/2 LS 90"},{"id":"1/2 ST 45"}]},{"id" :"三通","儿童":[{"id":"1/2 x 1/2 x 3/4"},{"id":"1/2"},{"id":"3/ 4 x 1/2 x 1/2"}]},{"id":"法兰"},{"id":"联轴器"},{"id":"Caps"},{"id":"工会"},{"id":"Reducers"},{"id":"适配器"},{"id":"Valve"}]},{"id":"Aquatherm","children":[{"id":"Elbows","children":[{"id":" 1/2 90"},{"id":"1/2 45"},{"id":"3/4 90"},{"id":"3/4 45"},{"id" :"1/2 LS 90"},{"id":"1/2 ST 45"}]},{"id":"三通","儿童":[{"id":"1/2 x 1/2 x 3/4"},{"id":"1/2"},{"id":"3/4 x 1/2 x 1/2"}]},{"id":"法兰"},{"id":"联轴器"},{"id":"Caps"},{"id":"Unions"},{"id":"异径管"},{"id":"适配器"},{"id":"阀门"}]}]},{"id":"阀门"},{"id":"加热和冷却","children":[{"id":"Radiant","children":[{"id":"油管","children":[{" id":"1/2 PEX"},{"id":"3/4 PEX"}]},{"id":"歧管"},{"id":"Heads"},{"id" :"阀门"},{"id":"配件"}]},{"id":"恒温器"},{"id":"热水器"},{"id":"泵/阀门"}, {"id":"Boilers"},{"id":"MiniSplits"}]},{"id":"In Stock Fixtures"},{"id":"Misc"}]id":"油管","children":[{"id":"1/2 PEX"},{"id":"3/4 PEX"}]},{"id":"歧管"}, {"id":"Heads"},{"id":"Valves"},{"id":"Fittings"}]},{"id":"Thermostats"},{"id":"Waterheaters" },{"id":"泵/阀门"},{"id":"锅炉"},{"id":"MiniSplits"}]},{"id":"库存夹具"},{" id":"杂项"}]id":"油管","children":[{"id":"1/2 PEX"},{"id":"3/4 PEX"}]},{"id":"歧管"}, {"id":"Heads"},{"id":"Valves"},{"id":"Fittings"}]},{"id":"Thermostats"},{"id":"Waterheaters" },{"id":"泵/阀门"},{"id":"锅炉"},{"id":"MiniSplits"}]},{"id":"库存夹具"},{" id":"杂项"}]恒温器"},{"id":"热水器"},{"id":"泵/阀门"},{"id":"锅炉"},{"id":"MiniSplits"}]},{" id":"库存赛程"},{"id":"Misc"}]恒温器"},{"id":"热水器"},{"id":"泵/阀门"},{"id":"锅炉"},{"id":"MiniSplits"}]},{" id":"库存赛程"},{"id":"Misc"}]

在新的序列化输出中看到的 JSON 具有： ... {"id":"1/2 ST 45"},{"id":"Plastic","children":[{"id":"Pipe" 。 .. 而有效的 JSON 具有： ... {"id":"1/2 ST 45"}]},{"id":"Tees","children":[{"id":"1/2 x 1/2 x 3/4"} ..

请注意，新的序列化输出在 {"id":"1/2 ST 45"} 之后缺少 ']}'

TIA。

4

0 回答 0