データベースからネスト可能な div コンテンツを動的に追加した後に問題が発生しました。
静的データでネスト可能は期待どおりに機能します。nestable2 から項目を追加し、シリアル化された出力で変更を確認できます。
動的データ を含むネスト可能は、ネスト可能2からネスト可能へのドラッグ/ドロップ機能を失いますが、ネスト可能内のドラッグ/ドロップは引き続き機能するように見えます. ただし、Serialized Output には変更が反映されません。
さらに、ネスト可能なシリアル化された出力の動的データ バージョンは完全ではないようです。2 つのリンク間でネスト可能なシリアライズされた出力を比較すると、ネスト可能な動的データ リンクの JSON オブジェクトが Metal カテゴリ メニューの後に終了することがわかりますが、完全なメニューはそのページのネスト可能な div と tshoot innerHTML に表示されます。
この問題を解決するために誰かが私を正しい方向に向けることができますか?
ありがとう！
質問があいまいですか？わかりました、詳細を追加させてください。
JSON からネスト可能なメニューを作成するコードを次に示します。
... 関数 buildItem(アイテム) {
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 を提供できません)。だから私はコードを
...
関数 buildItem(アイテム) {
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 タグで開始しました。
その種の作品ですが、今では追加の子を取得しています (例: Plastic、Valves、Heat and Cooling、In Stock Fixtures and Misc が Metal に追加されます。Valves、Heat and Cooling、In Stock Fixtures and Misc は Plastic and In Stock に追加されます) Fixtures and Misc は Heating and Cooling に追加されます。
したがって、明らかに if (item.children) ループに問題があります。
誰かが問題を見て、おそらく提案された修正をしていますか?
有効な JSON は次のとおりです。
[{"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":"銅","子供":[{"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":"肘","子供":[{"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":"肘","子":[{"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":"肘","子供":[{"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":"肘","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":"パイプ","子供":[{"id":"PVC"},{"id":"PEX"},{"id":"アクアサーム"}]},{"id":"PVC","子供":[{"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":"Unions"},{"id":"Reducers"},{"id":"Adapters"},{"id":"Valves"}]},{"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" :"Tシャツ","子供":[{"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":"ユニオン"},{"id":"レデューサー"},{"id":"アダプター"},{"id":"バルブ"}]},{"id":"Aquatherm","子":[{"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":"キャップ"},{"id":"ユニオン"},{"id":"レデューサー"},{"id":"アダプター"},{"id":"バルブ"}]}]},{"id":"バルブ"},{"id":"加熱と冷却","children":[{"id":"Radiant","children":[{"id":"Tubing","children":[{" id":"1/2 PEX"},{"id":"3/4 PEX"}]},{"id":"多様体"},{"id":"頭部"},{"id" :"バルブ"},{"id":"継手"}]},{"id":"サーモスタット"},{"id":"給湯器"},{"id":"ポンプ/バルブ"}, {"id":"ボイラー"},{"id":"MiniSplits"}]},{"id":"在庫設備"},{"id":"その他"}]id":"チューブ","子":[{"id":"1/2 PEX"},{"id":"3/4 PEX"}]},{"id":"多様体"}, {"id":"ヘッド"},{"id":"バルブ"},{"id":"継手"}]},{"id":"サーモスタット"},{"id":"給湯器" },{"id":"ポンプ/バルブ"},{"id":"ボイラー"},{"id":"MiniSplits"}]},{"id":"在庫設備"},{" id":"その他"}]id":"チューブ","子":[{"id":"1/2 PEX"},{"id":"3/4 PEX"}]},{"id":"多様体"}, {"id":"ヘッド"},{"id":"バルブ"},{"id":"継手"}]},{"id":"サーモスタット"},{"id":"給湯器" },{"id":"ポンプ/バルブ"},{"id":"ボイラー"},{"id":"MiniSplits"}]},{"id":"在庫設備"},{" id":"その他"}]サーモスタット"},{"id":"給湯器"},{"id":"ポンプ/バルブ"},{"id":"ボイラー"},{"id":"MiniSplits"}]},{" id":"在庫備品"},{"id":"その他"}]サーモスタット"},{"id":"給湯器"},{"id":"ポンプ/バルブ"},{"id":"ボイラー"},{"id":"MiniSplits"}]},{" id":"在庫備品"},{"id":"その他"}]
新しいシリアル化された出力に表示される 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"} の後に ']}' がないことに注意してください。
ティア。