<div class="row">
    <div class="col-sm-12">
        <p><a href="<?= base_url('admin/menus'); ?>"><i class="fa fa-arrow-left" aria-hidden="true"></i> Back to Menu List Page</a></p><br>
        <h4><?= empty($menus->id_menus) ? 'Add a new menu' : 'Edit menu: ' 
        . $menus->menu; ?></h4> 
        <?= $this->session->flashdata('success'); //to display success message ?> 
        <?= $this->session->flashdata('result'); //to display result message ?>
    </div><!-- end class="col-sm-12" --> 
</div> <!-- end row --> 

<?= form_open(); ?>

<div class="row">
    <div class="col-sm-3">
        <p>Menu Name</p>
    </div><!-- end class="col-sm-3" -->

     <div class="col-sm-9">
        <div class="tabbable">

          <!-- <ul class="nav nav-tabs">
              <li class="active"><a href="#menu_id" data-toggle="tab">Indonesian</a></li>
              <li><a href="#menu_en" data-toggle="tab">English</a></li>
          </ul>

          <div class="tab-content">
            
             <div class="tab-pane active" id="menu_id"> -->
                <p>
                <?php
                $data = array(
                    'name'        => 'menu',
                    'value'       => $menus->menu,
                    'class'       => 'form-control'
                );
                echo form_input($data); ?>
                <?= form_error('menu'); ?></p>
             <!-- </div> -->

             <!--  <div class="tab-pane" id="menu_en"> -->
               <!--  <p>
                <?php
                $data = array(
                    'name'        => 'menu_en',
                    'value'       => $menus->menu_en,
                    'class'       => 'form-control'
                );
                echo form_input($data); ?>
                <?= form_error('menu'); ?></p>
             </div>
          </div> --><!-- end class tab-content-->  

        </div><!-- end tabbable -->

    </div><!-- end class="col-sm-9" -->
</div> <!-- end row -->  

<div class="row">
    <div class="col-sm-3">
        <p>Parent Menu</p>
    </div><!-- end class="col-sm-3" -->
    <div class="col-sm-9">

       <select name="parent_id" class="form-control" id="chooseMenu">        
               
            <option value="no-parent"  
            <?php if ($menus->parent_id == NULL) : ?>
                selected="selected"
            <?php endif; ?>
            >No parent</option>
                
            <?php foreach($parent_menus as $parent) : ?> 
            
                <option value="<?= $parent->id_menus; ?>"

                <?php if ($menus->parent_id == $parent->id_menus): ?>
                    selected="selected" 
                <?php endif ?> 
                ><?= ucfirst($parent->menu); ?></option> 

                <?php
                    $this->db->select('*')->from('menus')->where('parent_id', $parent->id_menus)->order_by('priority', 'ASC');
                    $child = $this->db->get()->result();
                ?>

                <?php foreach ($child as $child_menu) : ?>

                    <option value="<?= $child_menu->id_menus; ?>"

                    <?php if ($menus->parent_id == $child_menu->id_menus): ?>
                        selected="selected" 
                    <?php endif ?> 
                    >- <?= ucfirst($child_menu->menu); ?></option>

                    <?php
                        $this->db->select('*')->from('menus')->where('parent_id', $child_menu->id_menus)->order_by('priority', 'ASC');
                        $child2 = $this->db->get()->result();
                    ?> 

                    <?php foreach ($child2 as $child_menu2) : ?>

                    <option value="<?= $child_menu2->id_menus; ?>"

                        <?php if ($menus->parent_id == $child_menu2->id_menus): ?>
                            selected="selected" 
                        <?php endif ?> 
                        >-- <?= ucfirst($child_menu2->menu); ?></option>

                    <?php endforeach; ?>

                <?php endforeach; ?>

            <?php endforeach; ?>      
              
            </select> 
            <p><?= form_error('parent_id'); ?></p> 
    </div><!-- end class="col-sm-9" -->
</div> <!-- end row -->  

<div class="row">
    <div class="col-sm-3">
        <p>Menu Type</p>
    </div><!-- end class="col-sm-3" -->

     <div class="col-sm-9">
        <select name="menu_type" id="select_menu_type" class="form-control">
            <option value="">select menu type...</option>
            
            <option value="homepage"
            <?php if ($menus->menu_type == 'homepage'): ?>
                selected="selected" 
            <?php endif ?>
            >Homepage</option>

            <option value="page"
            <?php if ($menus->menu_type == 'page'): ?>
                selected="selected"
            <?php endif ?>
            >Page</option>

             <option value="services"
            <?php if ($menus->menu_type == 'services'): ?>
                selected="selected"
            <?php endif ?>
            >Services</option>

            <option value="industries"
            <?php if ($menus->menu_type == 'industries'): ?>
                selected="selected" 
            <?php endif ?>
            >Industries</option>
            
             <option value="location"
            <?php if ($menus->menu_type == 'location'): ?>
                selected="selected"
            <?php endif ?>
            >Locations</option>
           
            <option value="contact"
            <?php if ($menus->menu_type == 'contact'): ?>
                selected="selected"
            <?php endif ?>
            >Contact</option>

            <option value="external"
            <?php if ($menus->menu_type == 'external'): ?>
                selected="selected"
            <?php endif ?>
            >External URL</option>
        </select>
        <?= form_error('menu_type'); ?></p>
    </div><!-- end class="col-sm-9" -->
</div> <!-- end row -->  

<div id="container"></div>

<div class="row">
    <div class="col-sm-3">
        <p>Ordering (number only)</p>
    </div><!-- end class="col-sm-3" -->

     <div class="col-sm-9">
        <p>
        <?php
        $data = array(
            'name'        => 'priority',
            'value'       => $menus->priority,
            'class'       => 'form-control'
         );
        echo form_input($data); ?>
        <?= form_error('priority'); ?></p>
    </div><!-- end class="col-sm-9" -->
</div> <!-- end row -->  

<div class="row">
    <div class="col-sm-3">
        <p>Display</p>
    </div><!-- end class="col-sm-3" -->

     <div class="col-sm-9">
        <?php
            $options = array(
                1  => 'Yes',
                0  => 'No'
            );
            echo form_dropdown('status', $options, $menus->status, 'class="form-control"');
        ?>   
    </div><!-- end class="col-sm-9" -->
</div> <!-- end row -->  

<div class="row">
    <div class="col-sm-3">
    </div><!-- end class="col-sm-3" -->
     <div class="col-sm-9">
        <?= form_submit('submit', 'Update', 'class="btn btn-primary btn-success button-brown"'); ?>
        &nbsp;&nbsp;&nbsp;<?= anchor('admin/menus', 'cancel'); ?>
    </div><!-- end class="col-sm-9" -->
</div> <!-- end row -->  

<?= form_close(); ?>

<script>

$(document).ready(function() {
   
    var menu_type = $('#select_menu_type').val();

    <?php if (!empty($menus->id_menus)) : ?>
        var current_menu_id = '<?= $menus->id_menus; ?>';
    <?php else : ?>
        var current_menu_id = null;    
    <?php endif; ?>

    if (menu_type != '') {
        load_data_ajax(menu_type, current_menu_id);
    }

    $('#select_menu_type').change(function() {
        var menu_type = $(this).val();
        load_data_ajax(menu_type);
    });   
    
    function load_data_ajax(menu_type, current_menu_id) {
        $.ajax({
            'url'       : '<?php echo site_url(); ?>' + 'admin/menus/ajax_get_menutype',
            'type'      : 'POST',
            'data'      : {
                          'menu_type' : menu_type, 
                          'current_menu_id' : current_menu_id,
                          '<?= $this->security->get_csrf_token_name(); ?>' : '<?= $this->security->get_csrf_hash(); ?>'
                          }, 
            'success'   : function(data) { 
                var container = $('#container');
                if (data) {
                    container.html(data);   
                };
            }
        });
    }

});

</script>