<div class="col-sm-9 col-sm-offset-3 col-md-10 col-md-offset-2 main">
    <div class="">
        <a href="<?php echo base_url(); ?>super_admin">Dashboard</a>->>
        <span>Add Menu</span>
    </div>
    <h1 class="page-header">Add Menu Form</h1>
    <p>
        <?php
        $message = $this->session->userdata('message');
        $this->session->unset_userdata('message');
        if ($message) {
            echo $message;
        }
        ?>
    </p>
    <div class="table-responsive col-sm-12">
        <?php // echo validation_errors(); ?>
        <form action="<?php echo base_url(); ?>super_admin/edit_menu/<?php echo $menu_info->menu_id ?>" method="post" name="menuForm" enctype="multipart/form-data" >
            <div class="form-group col-sm-10">

                <div class="form-group col-sm-4">
                    <label for="menu_type">Menu Type:</label>
                    <span class="required"> * </span>
                    <select for="menu_type" class="form-control" name="menu_type", id="menu_type">
                        <option value="">Select Type</option>
                        <option value="1">Top Menu</option>
                        <option value="2">Bottom Menu</option>
                    </select>
                </div>

                <script>

                    document.forms['menuForm'].elements['menu_type'].value = '<?php echo $menu_info->menu_type ?>';

                    function checkUserEmail(given_text, objID)
                    {
                        if (given_text != '') {
                            serverPage = '<?php echo base_url(); ?>super_admin/check_user_email/' + given_text;  // passing person_email Field value 
                        } else if (given_text == '') {
                            document.getElementById('submit').disabled = true;
                            document.getElementById('agree').value = false;
                            document.getElementById(objID).innerHTML = '<p style="color:red;">Please Enter your Email</p>';
                        }
                        /*
                         *  After Database Check display message 
                         *  if available the message will be Email Address Available
                         *  if same email address exist in database then message show Email Address Already Exists
                         */
                        xmlhttp.open("GET", serverPage);
                        xmlhttp.onreadystatechange = function ()
                        {
                            if (xmlhttp.readyState == 4 && xmlhttp.status == 200)
                            {
                                if (xmlhttp.responseText == 1)
                                {
                                    document.getElementById(objID).innerHTML = '<p style="color:red;">Email Address Already Exists</p>';
                                    document.getElementById(objID).value = 1;
                                    document.getElementById('submit').disabled = true;
                                    document.getElementById('agree').checked = false;
                                } else if (xmlhttp.responseText == 2)
                                {
                                    document.getElementById(objID).innerHTML = '<p style="color:green;">Email Address Available</p>';
                                    document.getElementById(objID).value = 2;
                                    document.getElementById('agree').checked = false;
                                    document.getElementById('submit').disabled = true;
                                }
                            }
                        }
                        xmlhttp.send(null);
                    }
                </script>
                <div class="form-group col-sm-8" id=""></div>
                <div class="form-group col-sm-4" id="menu_type_status"><?php echo form_error('menu_type'); ?></div>
            </div>

            <div class="form-group col-sm-10">

                <div class="form-group col-sm-4">
                    <label for="menu_name">Menu Name</label><span class="required"> * </span>
                    <input type="text" class="form-control" id="menu_name" name="menu_name" value="<?php
                    if ($menu_info->menu_name) {
                        echo $menu_info->menu_name;
                    } else {
                        echo set_value('menu_name');
                    }
                    ?>" onblur="checkFirstName(this.value, 'menu_name')" placeholder="Enter Menu Name" >                 
                </div>

                <script>
                    function checkFirstName(given_text, objID) {
                        if (given_text == '') {
                            document.getElementById('submit').disabled = true;
                            document.getElementById('agree').checked = false;
                            document.getElementById(objID).innerHTML = '<p style="color:red;">Please Enter your Menu Name</p>';
                        } else {
                            document.getElementById('submit').disabled = false;
                            document.getElementById('agree').checked = true;
                            document.getElementById(objID).innerHTML = '<p style="color:red;"></p>';
                        }
                    }
                </script>

                <div class="form-group col-sm-4" id="gender_status"> </div>

            </div>

            <div class="form-group col-sm-4">
                <div class="form-group col-sm-12">
                    <label for="menu_url">Menu URL:</label><span class="required"> * </span>

                    <input type="text" class="form-control" id="menu_url" name="menu_url" onkeyup="checkMenuUrl(this.value, 'menu_url_status');" placeholder="Use dash (-) in the place of space"  value="<?php
                    if ($menu_info->menu_url) {
                        echo $menu_info->menu_url;
                    } else {
                        echo set_value('menu_url');
                    }
                    ?>">

                    <script>
                        function checkMenuUrl(given_text, objID)
                        {
                            if (given_text != '') {
//                                alert(given_text);
                                var patt = new RegExp(" ");
                                var res = patt.test(given_text);
                                if (res) {
                                    document.getElementById(objID).value = '<p style="color:red;">Please Enter Course URL and Use dash (-) in the place of space</p>';
                                }
                                document.getElementById(objID).innerHTML = '<p style="color:red;"></p>';
                            } else if (given_text == '') {
                                document.getElementById('submit').disabled = true;
                                document.getElementById(objID).innerHTML = '<p style="color:red;">Please Enter Course URL and Use dash (-) in the place of space</p>';
                            }
                        }
                    </script>

                </div>

                <div id="menu_url_status">  </div>

            </div>

            <div class="form-group col-sm-10">
                <div class="checkbox col-sm-6" >
                    <button type="submit" id="submit" class="btn btn-default">Submit</button>
                    <button type="reset" class="btn btn-default">Reset</button>
                </div>
            </div>

        </form>
    </div>
</div>
