Nestable Pluginから取得した多次元配列をOrdered List
プラグインのHTML
構造によって抽出しようとしています。
私が作成した再帰は、OL
私が作成しているタグLI
が子を持つタグの外側にあるため、十分ではありません。一見、簡単な作業のように見えましたが、完了できませんでした。
これは私がこれまでに書いたものです。LI
再帰の次のループが子を持つものであるかどうかを確認する方法がわかりませOL
んdiv
。
(プラグインの HTML 構造の例を以下に示します)
function buildNestedList($a) {
if (!is_array($a)) {
echo ('<li class="dd-item" data-name="'.$a.'"><div class="dd-handle">'.$a.'</div></li>');
return;
}
foreach($a as $k => $v) {
if(($k=="children")&&(is_string($k))) {
echo ('<ol class="dd-list">');
buildNestedList($v);
echo ("</ol></li>");
}
else {
printAll($v);
}
}
}
これは私の関数の出力です:
<div class="dd" id="nestable">
<ol class="dd-list">
<li class="dd-item" data-name="item 1">
<div class="dd-handle">item 1</div>
</li>
<li class="dd-item" data-name="item 2">
<div class="dd-handle">item 2</div>
</li>
<li class="dd-item" data-name="item 3">
<div class="dd-handle">item 3</div>
</li>
<ol class="dd-list">
<li class="dd-item" data-name="item 4">
<div class="dd-handle">item 4</div>
</li>
<li class="dd-item" data-name="item 5">
<div class="dd-handle">item 5</div>
</li>
<li class="dd-item" data-name="item 6">
<div class="dd-handle">item 6</div>
</li>
<ol class="dd-list">
<li class="dd-item" data-name="item 7">
<div class="dd-handle">item 7</div>
</li>
<li class="dd-item" data-name="item 8">
<div class="dd-handle">item 8</div>
</li>
</ol>
</ol>
<li class="dd-item" data-name="item 9">
<div class="dd-handle">item 9</div>
</li>
<li class="dd-item" data-name="item 10">
<div class="dd-handle">item 10</div>
</li>
<li class="dd-item" data-name="item 11">
<div class="dd-handle">item 11</div>
</li>
</ol>
</div>
Array
これは、 DB から取得した例です。
Array
(
[0] => Array
(
[name] => item 1
)
[1] => Array
(
[name] => item 2
)
[2] => Array
(
[name] => item 3
[children] => Array
(
[0] => Array
(
[name] => item 4
)
[1] => Array
(
[name] => item 5
)
[2] => Array
(
[name] => item 6
[children] => Array
(
[0] => Array
(
[name] => item 7
)
[1] => Array
(
[name] => item 8
)
)
)
)
)
[3] => Array
(
[name] => item 9
)
[4] => Array
(
[name] => item 10
)
[5] => Array
(
[name] => item 11
)
)
これは正しいプラグインのHTML
構造の例です:
<ol class="dd-list">
<li class="dd-item" data-name="item 1">
<div class="dd-handle">item 1</div>
</li>
<li class="dd-item" data-name="item 2">
<button data-action="collapse" type="button">Collapse</button><button data-action="expand" type="button" style="display: none;">Expand</button>
<div class="dd-handle">item 2</div>
<ol class="dd-list">
<li class="dd-item" data-name="item 3">
<div class="dd-handle">item 3</div>
</li>
<li class="dd-item" data-name="item 4">
<div class="dd-handle">item 4</div>
</li>
<li class="dd-item" data-name="item 5">
<div class="dd-handle">item 5</div>
</li>
</ol>
</li>
<li class="dd-item" data-name="item 6">
<button data-action="collapse" type="button">Collapse</button><button data-action="expand" type="button" style="display: none;">Expand</button>
<div class="dd-handle">item 6</div>
<ol class="dd-list">
<li class="dd-item" data-name="item 7">
<button data-action="collapse" type="button">Collapse</button><button data-action="expand" type="button" style="display: none;">Expand</button>
<div class="dd-handle">item 7</div>
<ol class="dd-list">
<li class="dd-item" data-name="item 8">
<div class="dd-handle">item 8</div>
</li>
</ol>
</li>
</ol>
</li>
</ol>