CODEWITHSUNDEEP
phparraysrecursionmultidimensional-arraycheckbox
chhameed
chhameed

Reputation: 4446

Recursively traverse a multidimensional array and print hierarchical sets of checkboxes

i have a multidimensional array like this

$role = array (
    'Dashboard' => null,
    'Students' => array (
        'Admission' => array (
            0 => 'Entry',
            1 => 'Review',
            2 => 'Approved/Reject'
        ),
        'Search' => null,
        'AdvanceSearch' => null,
        'Courses' => null
    ),
    'HR' => array (
        'Settings' => null
    ),
    'Employee Management' => array (
        0 => 'Entry',
        1 => 'Association',
        2 =>  'Search'
    ),
    'Employee Attendance' => null,
    'Payroll' => array (
        0 => 'Generate Pay Slip',
        1 => 'Payroll Run',
        2 => 'Payroll Revert',
        3 =>  'View Pay Slips'
    ),
    'Finance' => null,
    'More' => null
);

and I want to print this array result in my html as

Here is the wanted solution

I am trying to do this by using recursion but unable to do that as DIV are not properly closed.

Here is the code that I am trying in my html:

$child = 0;
function RecursiveWrite($array, $child ) {
    $parent_array_size =  count($array);
    foreach ($array as $key => $vals) {
        if(is_array($vals)){
            $inner_array_size = count($vals);
            echo "<div class='main clear'><input type='checkbox'/> ".$key." &nbsp; &nbsp; ";
            RecursiveWrite($vals,$child);
        }else{
            $child = 0;
            if(is_numeric($key)){
                echo " &nbsp; <div class='left'> &nbsp; &nbsp; <input type='checkbox' class=''/> ".$vals." &nbsp; &nbsp; </div></div>";
            }else{
                echo "<div class='clear'><input type='checkbox'/> ".$key." </div></div>";
            }
        }
        //
    }
}
RecursiveWrite($role, $child);

Here is working code

How can I get this?

Upvotes: 0

Views: 314

Answers (2)

Kuf
Kuf

Reputation: 17828

You're not closing the div in the right places, when calling the recursion, right after ending the recursion you need to write the ending div:

  • open div
  • run recursion
  • close div

As well, you have two unnecessary div closing. Always make sure you open as many div as you close and vice versa. I've marked the places that needed to be changed in the code.

code:

<?php 
    $child = 0;
    function RecursiveWrite($array, $child ) {
        $parent_array_size =  count($array);
        foreach ($array as $key => $vals) {
            if(is_array($vals)){
                $inner_array_size = count($vals);
                echo "<div class='main clear'><input type='checkbox'/> ".$key." &nbsp; &nbsp; ";
                RecursiveWrite($vals,$child);
                echo "</div>"; /* <== ADD THIS */
            }else{
                $child = 0;
                if(is_numeric($key)){
                    echo " &nbsp; <div class='left'> &nbsp; &nbsp; <input type='checkbox' class=''/> ".$vals." &nbsp; &nbsp; </div>"; /* <== REMOVE EXTRA DIV */
                }else{
                    echo "<div class='clear'><input type='checkbox'/> ".$key." </div>";  /* <== REMOVE EXTRA DIV */
                }
            }
            //
        }
    }
    RecursiveWrite($role, $child);
?>

you can find a working example at http://codepad.viper-7.com/507rLc

Upvotes: 1

GajendraSinghParihar
GajendraSinghParihar

Reputation: 9131

Your Problem is missing closing div after recursion Try this Function 

function RecursiveWrite($array, $child )
{
    $parent_array_size =  count($array);
    foreach ($array as $key => $vals)
     {
        if(is_array($vals))
        {
            $inner_array_size = count($vals);
            echo "<div class='deep'><div class='extra'><input type='checkbox'/> ".$key."</div>";
            RecursiveWrite($vals,$child);
            echo "</div>";
        }
        else
        {
            if(is_numeric($key)){
                echo "<span class='single'><input type='checkbox' class=''/> ".$vals."</span>";
            }else{
                echo "<div class='single'><input type='checkbox'/> ".$key." </div>";
            }

        }
    }
}

Use This Css 

<style type="text/css">
    .parent {border: solid 1px #000;}
    .parent div {border: solid 1px #000; margin:5px;}
    .extra {border:0px !important;}
    .single {margin-left:10px !important; border:0px !important;}
    span.single {display:inline-block; margin-left:20px;}
</style>

Use this to call your Function 

<div class="parent"><? RecursiveWrite($role, $child);?></div>

Put all the code Provided in one page with your array.

For better Codding standard you should Septate your style html and php for this try your luck ;)

Upvotes: 3

Related Questions