CodeIgniter Forums
Keeping parent menu items active in child pages - Printable Version

+- CodeIgniter Forums (https://forum.codeigniter.com)
+-- Forum: Using CodeIgniter (https://forum.codeigniter.com/forum-5.html)
+--- Forum: General Help (https://forum.codeigniter.com/forum-24.html)
+--- Thread: Keeping parent menu items active in child pages (/thread-275.html)



Keeping parent menu items active in child pages - ahmadmilzam - 11-16-2014

Helo, I have this array of navigation from db, and i've already prepare the array in parent child format. So my question is, how do i keep the parent menu active when i visit the child pages. i'm using Codeigniter. the slug is dynamically defined by the user in admin panel.

here is my dummy array:

PHP Code:
array(3) {
 
 [0]=>
 
 array(4) {
 
   ["id"]=>
 
   int(1)
 
   ["menu_item"]=>
 
   string(5"Item1"
 
   ["slug"]=>
 
   string(6"item-1"
 
   ["parent_id"]=>
 
   int(0)
 
 }
 
 [1]=>
 
 array(5) {
 
   ["id"]=>
 
   int(2)
 
   ["menu_item"]=>
 
   string(5"Item2"
 
   ["slug"]=>
 
   string(6"item-2"
 
   ["parent_id"]=>
 
   int(0)
 
   ["children"]=>
 
   array(1) {
 
     [0]=>
 
     array(5) {
 
       ["id"]=>
 
       int(5)
 
       ["menu_item"]=>
 
       string(5"Item5"
 
       ["slug"]=>
 
       string(6"item-5"
 
       ["parent_id"]=>
 
       int(2)
 
       ["children"]=>
 
       array(1) {
 
         [0]=>
 
         array(4) {
 
           ["id"]=>
 
           int(4)
 
           ["menu_item"]=>
 
           string(5"Item4"
 
           ["slug"]=>
 
           string(6"item-4"
 
           ["parent_id"]=>
 
           int(5)
 
         }
 
       }
 
     }
 
   }
 
 }
 
 [2]=>
 
 array(4) {
 
   ["id"]=>
 
   int(3)
 
   ["menu_item"]=>
 
   string(5"Item3"
 
   ["slug"]=>
 
   string(6"item-3"
 
   ["parent_id"]=>
 
   int(0)
 
 }



here is my routes setup to grab the page:
PHP Code:
$route['([a-zA-Z0-9_-]+)'] = 'pages/render'


for now i only success to get the menu active when visiting the root page by compare the slug with uri_segment(1) with this function:

PHP Code:
function get_menu ($array$child FALSE)
{
 
   $CI =& get_instance();
 
   $str '';

 
   if (count($array)) {
 
       $str .= $child == FALSE '<ul class="nav">' PHP_EOL '<ul class="dropdown-menu">' PHP_EOL;

 
       foreach ($array as $item) {

 
           $active $CI->uri->segment(1) == $item['slug'] ? TRUE FALSE;
 
           if (isset($item['children']) && count($item['children'])) {
 
               $str .= $active '<li class="dropdown active">' '<li class="dropdown">';
 
               $str .= '<a  class="dropdown-toggle" data-toggle="dropdown" href="' site_url(e($item['slug'])) . '">' e($item['title']);
 
               $str .= '<b class="caret"></b></a>' PHP_EOL;
 
               $str .= get_menu($item['children'], TRUE);
 
           }
 
           else {
 
               $str .= $active '<li class="active">' '<li>';
 
               $str .= '<a href="' site_url($item['slug']) . '">' e($item['title']) . '</a>';
 
           }
 
           $str .= '</li>' PHP_EOL;
 
       }

 
       $str .= '</ul>' PHP_EOL;
 
   }

 
   return $str;


Please let me know what is the correct way to achive this.

Thank you very much


RE: Keeping parent menu items active in child pages - alroker - 11-16-2014

I use a My_Controller to render my views within a universal template view that has my nav in it. Then from within a controller I have a var called page_name that I can set with the nav name. That gets passed to the template view when rendered. Then in template view I use a shorthand IF to say if page_name = the name of my nav item, set the css class to active. Hope that makes sense. I don't have time right now to show code.


RE: Keeping parent menu items active in child pages - ahmadmilzam - 11-16-2014

Hi I know what you mean,but that is just same as my solution right know.


(11-16-2014, 12:32 PM)alroker Wrote: I use a My_Controller to render my views within a universal template view that has my nav in it. Then from within a controller I have a var called page_name that I can set with the nav name. That gets passed to the template view when rendered. Then in template view I use a shorthand IF to say if page_name = the name of my nav item, set the css class to active. Hope that makes sense. I don't have time right now to show code.



RE: Keeping parent menu items active in child pages - Hobbes - 11-17-2014

(11-16-2014, 12:32 PM)alroker Wrote: I use a My_Controller to render my views within a universal template view that has my nav in it. Then from within a controller I have a var called page_name that I can set with the nav name. That gets passed to the template view when rendered. Then in template view I use a shorthand IF to say if page_name = the name of my nav item, set the css class to active. Hope that makes sense. I don't have time right now to show code.

i do something very similiar, but instead of additional shorthand IF blocks i echo out the $page_name variable to the Javascript (jquery based menu system) there is an option in the menu system i use that is: active_menu: 'MENUID/CLASSNAME'.


RE: Keeping parent menu items active in child pages - ahmadmilzam - 12-18-2014

Really? no one in this community that could possibly help me?


RE: Keeping parent menu items active in child pages - InsiteFX - 12-18-2014

This is how I sat the active state in a helper file, I' am sure you can add a new method for the child pages.

PHP Code:
/**
 * ------------------------------------------------------------------------
 * active_link()
 *
 * Sets the active links
 *
 * Usage HTML Code:
 *
 * <li <?php echo active_link('Welcome');?>>
 *
 * @access    public
 * @param    string
 * @return    string
 */
if ( ! function_exists('active_link'))
{
    function 
active_link($controller)
    {
        
$_ci get_instance();
        
$class $_ci->router->fetch_class();
        return (
$class == $controller) ? ' class="active"' '';
    }


active_link is your page name.


RE: Keeping parent menu items active in child pages - apparasenal - 12-18-2014

A very simple solution and works fast. Instead of using a controller you can do it directly in the views page where your navigation (menu) file is written.

<?php $segment = $this->uri->segment(1); ?>

Then in your Dropdown menu:

<li class="sub-menu">
<a href="javascript:void(0);" <?php echo ($segment == 'settings-seo' || $segment == 'settings-email') ? 'class="active"' : 'class=""'?>>
<i class="fa fa-cogs"></i>
<span>Settings</span>
</a>
<ul class="sub">
<li><a href="settings-seo">Search Engines</a></li>
<li><a href="settings-email">Email Template</a></li>
</ul>
</li>

Is there a way we can paste code snippet properly in this forum?


RE: Keeping parent menu items active in child pages - _this - 12-19-2014

(12-18-2014, 11:41 PM)apparasenal Wrote: A very simple solution and works fast. Instead of using a controller you can do it directly in the views page where your navigation (menu) file is written.

<?php $segment = $this->uri->segment(1); ?>

Then in your Dropdown menu:

<li class="sub-menu">
  <a href="javascript:void(0);" <?php echo ($segment == 'settings-seo' || $segment == 'settings-email') ? 'class="active"' : 'class=""'?>>
     <i class="fa fa-cogs"></i>
     <span>Settings</span>
  </a>
  <ul class="sub">
      <li><a  href="settings-seo">Search Engines</a></li>
      <li><a  href="settings-email">Email Template</a></li>
  </ul>
</li>

Is there a way we can paste code snippet properly in this forum?

You can use these tags :

Code:
[php][/php]

Or :

Code:
[code][ /code] (remove the space)