CODEWITHSUNDEEP
phptwitter-bootstrapcodeigniter
Mudassar Khani
Mudassar Khani

Reputation: 1479

Parent - Child - Grand Child category Markup in Codeigniter view

I have a test Database Table by the name of autos like following

enter image description here

I am using a recursive function in my model to get the data in array and dumped it. It looks perfect like following

Array
(
[menu] => Array
    (
        [0] => Array
            (
                [id] => 1
                [name] => Automobiles
                [parent] => 0
                [child] => Array
                    (
                        [0] => Array
                            (
                                [id] => 2
                                [name] => Honda
                                [parent] => 1
                                [child] => Array
                                    (
                                        [0] => Array
                                            (
                                                [id] => 3
                                                [name] => Cars
                                                [parent] => 2
                                                [child] => Array
                                                    (
                                                        [0] => Array
                                                            (
                                                                [id] => 4
                                                                [name] => Civic
                                                                [parent] => 3
                                                                [child] => Array
                                                                    (
                                                                        [0] => Array
                                                                            (
                                                                                [id] => 5
                                                                                [name] => Prosmetic
                                                                                [parent] => 4
                                                                            )

                                                                    )

                                                            )

                                                    )

                                            )

                                    )

                            )

In my view I am creating a standard bootstrap multi-level dropdown but I am not getting all the child menus

enter image description here

Problem : I am not getting all the child

I believe I have found the reason which is in my view code . Following is the code snippet which renders the drop-down

<div class="dropdown">
<button class="btn btn-default dropdown-toggle" type="button" data-toggle="dropdown">Menu<span class="caret"></span></button>
    <ul class="dropdown-menu">
        <?php for($i=0;$i<count($menu);$i++){?>
            <?php if(!empty($menu[$i]['child'])){?>
                <li class="dropdown-submenu">
                    <a class="test" href="#"><?php echo $menu[$i]['name']?> <span class="caret"></span></a>
                    <ul class="dropdown-menu">
                        <?php for($j=0;$j<count($menu[$i]['child']);$j++){?>
                            <li><a href="#"><?php echo $menu[$i]['child'][$j]['name']?></a></li>
                        <?php }?>
                    </ul>
                </li>
            <?php }else{?>
                <li><a tabindex="-1" href="#"><?php echo $menu[$i]['name']?></a></li>
        <?php }}?>
    </ul>
</div>

I am only able to get First level child because I am only checking for the first level child. How can I do it repeatedly (recursively) in the view. I can't just keep checking for sub-child of a child and so on.. There has to be a way. Can anyone point me to the right direction please?

EDIT: My Model

function getCategoriesByParentId($category_id) {
    $data = $this->db->select('*')->from('autos')->WHERE('parent',$category_id)->get()->result_array();
    for($i=0;$i<count($data);$i++)
    {
        if($this->getCategoriesByParentId($data[$i]['id']))
        {
            $data[$i]['child']=$this->getCategoriesByParentId($data[$i]['id']);
        }
    }
    return $data;
}

My Controller 

public function index()
{
    $this->load->model('Test_model');
    $data['menu']=$this->Test_model->getCategoriesByParentId(0);
    //echo '<pre>';print_r(($data));echo '</pre>';exit;

    $data['title']='testing';
    $this->load->view('head',$data);
    $this->load->view('dropdown');
}

I inserted some more categories and subcategories. Now the Menu looks like this

enter image description here

Upvotes: 0

Views: 2609

Answers (1)

Michael Krikorev
Michael Krikorev

Reputation: 2156

A recursive function might be of help. It could be placed in a helper file, and then you could call it from the view like printMenu($menu);

UPDATE WITH EXAMPLE: If you need to exclude the first element in your array, as it seems that you want to identify it as a parent, you could do something like this:

HELPER: (for example menu_helper.php put in folder helper)

function printMenu($a) {

  if (!is_array($a)) {
    return;
  } 

  foreach($a as $m) {         
      if($m['parent'] > 0){
          echo '<li><a tabindex="-1" href="#">'. $m['name'] .'</a></li>';             
      }

      if(is_array($m['child'])){
        printMenu($m['child']);
      }
  }
}

VIEW:

<div class="dropdown">
<button class="btn btn-default dropdown-toggle" type="button" data-toggle="dropdown">Menu<span class="caret"></span></button>
    <ul class="dropdown-menu">
        <?php if($has_children){ ?>
            <li class="dropdown-submenu">
                <a class="test" href="#"><?php echo $menu[0]['name']?> <span class="caret"></span></a>
                <ul class="dropdown-menu">                      
                    <?php printMenu($menu); ?>
                </ul>
            </li>
        <?php } else {?>
            <li><a tabindex="-1" href="#"><?php echo $menu[0]['name']?></a></li>
        <?php } ?>
    </ul>
</div>

CONTROLLER:

public function index()
{
    $this->load->helper('menu'); // OUR NEW HELPER FILE
    $this->load->model('Test_model');
    $data['menu'] = $this->Test_model->getCategoriesByParentId(0);
    $data['has_children'] = 1; //REPLACE WITH A QUERY OR FUNCTION TO CHECK IF CHILDREN EXISTS IN YOU MENU
    $this->load->view('dropdown', $data);
}

The example above only applies to arrays with one single parent. If you need multiple parents you have to call the function for each parent. THis is not optimal, an if you need more advanced handling of menus with multiple depths in Codeigniter you could check the library in this project: https://github.com/edomaru/codeigniter_multilevel_menu

The library is not updated for a while and I don't know if its compatible with CI 3, but maybe you could get some ideas of how to go along by checking the source code. They even have a Bootstrap 3 example there.

Upvotes: 2

Related Questions