I know, the headline is not very specific, but I dont't know how to title it.
I want to create a list from 1 to 10. All those numbers should be clickable and open a sublist. Again with the numbers from 1-10. Like this:
and so on... Here is some code, I've got:
<?php
$num = $_GET['zahl'];
$zahlen = array();
while($num != 0){
$part = $num % 10;
array_push($zahlen, $part);
$num = floor($num/10);
}
foreach ($zahlen as $key => $value) {
$runs = $value + 1;
for ($i=1; $i < $runs ; $i++) {
if ($i == 1) {
echo $ulon . "
";
}
echo $lion . "
";
echo $a . "ordner.php?zahl=" . $i . $amiddle . $i . $aoff . "
";
echo $lioff . "
";
}
for ($i=1; $i < 11 ; $i++) {
if ($i == 1) {
echo $ulon;
}
echo $lion . "
";
echo $a . "ordner.php?zahl=" . $zahlen[0] . $i . $amiddle . $i . $aoff;
echo $lioff . "
";
}
echo $uloff;
echo "
" . "</body>";
?>
What you wish to achieve should be fairly straigtforward with Javascript rather than PHP - the following uses PHP only to generate the initial list and subsequent sub-lists are generated using javascript.
<?php
echo "<ul id='infinite-menu'>";
for( $i=1; $i < 11; $i++ ){
echo "<li>$i</li>";
}
echo "</ul>";
?>
<script>
var children=10;
function newnodes(e){
if( e.target.childNodes.length==1 ){
var ul=document.createElement('ul');
e.target.appendChild(ul);
for( i=1; i < children+1; i++ ){
var li=document.createElement('li');
li.innerHTML=i;
ul.appendChild( li );
}
}
}
var col=document.querySelectorAll('ul#infinite-menu li');
if( col )for( n in col )if( col[n].nodeType==1){
col[n].addEventListener('click',newnodes,false);
}
</script>
This is my solution based on php. Thanks for your comments!
<body>
<?php
$open = isset($_GET["open"]) ? $_GET["open"] : "";
$openArr = explode(",",$open);
function liste($openArr, $link) {
$firstValue = array_shift($openArr);
echo "<ul>";
for ($i = 0; $i < 10; $i++) {
echo "<li>";
echo "<a href='rekursion.php?open=".$link.$i."'>$i</a>";
if (isset($firstValue) && $firstValue == $i) {
liste($openArr, $link.$i.",");
}
echo "</li>";
}
echo "</ul>";
}
liste($openArr,"");
?>
</body>