
<div class="right_col" role="main">
    <div class="">


        <div class="row">
            <div class="col-md-12 col-sm-12 col-xs-12">
                <?php if (isset($suc_msg) && $suc_msg) { ?>
                    <div class = "alert alert-success" style="padding: 10px;">
                        <strong>Success!</strong> <span><?php echo $suc_msg ?></span>
                    </div>
                <?php } ?>
                </div>
                <div class="col-md-12 col-sm-12 col-xs-12">
                    <div class="x_panel">
                        <div class="x_title">
                            <h2>Supervisor viewed</h2>
                            <div class="clearfix"></div>
                        </div>
                        <div class="x_content form-horizontal form-label-left">
                            <div id="wizard" class="form_wizard wizard_horizontal">
                                <ul class="wizard_steps">
                                    <li>
                                        <a href="#step-1">
                                            <span class="step_no">1</span>
                                            <span class="step_descr">
                                                Personal Details
                                            </span>
                                        </a>
                                    </li>
                                    <li>
                                        <a href="#step-2">
                                            <span class="step_no">2</span>
                                            <span class="step_descr">
                                                Center Selection
                                            </span>
                                        </a>
                                    </li>
                                </ul>
                                <div id="step-1">
                                    <h2 class="StepTitle">Personal Details</h2>
                                    <div class="form-group">
                                        <label class="control-label col-md-3 col-sm-3 col-xs-12">First Name <span class="required">*</span>
                                        </label>
                                        <div class="col-md-6 col-sm-6 col-xs-12">
                                            <input type="text" class="form-control" value="<?php echo $user['firstname'] ?>" disabled="true"/>
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label class="control-label col-md-3 col-sm-3 col-xs-12">Last Name 
                                        </label>
                                        <div class="col-md-6 col-sm-6 col-xs-12">
                                            <input type="text" class="form-control" value="<?php echo $user['lastname'] ?>" disabled="true"/>
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label class="control-label col-md-3 col-sm-3 col-xs-12">Mobile 
                                        </label>
                                        <div class="col-md-6 col-sm-6 col-xs-12">
                                            <input type="text" class="form-control" value="<?php echo $user['mobile'] ?>" disabled="true"/>
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label class="control-label col-md-3 col-sm-3 col-xs-12" >Executive 
                                        </label>
                                        <div class="col-md-6 col-sm-6 col-xs-12">
                                            <input type="text" class="form-control" value="<?php echo $executive ?>" disabled="true"/>
                                        </div>
                                    </div>

                                    <div class="form-group">
                                        <div class="col-md-6 col-sm-6 col-xs-12">
                                            <input type="hidden" class="form-control" value="<?php echo $user['username'] ?>" disabled="true"/>
                                        </div>
                                    </div>
                                </div>
                                <div id="step-2">
                                    <h2 class="StepTitle">Center Selection</h2>
                                    <div class="row">
                                        <table class="table table-bordered">
                                            <thead>
                                                <tr>
                                                    <th>Area</th>
                                                    <th>Center</th>
                                                </tr>
                                            </thead>
                                            <tbody>
                                                <?php foreach ($center as $row) { ?>
                                               <tr>
                                                    <td>
                                                        <div class="form-group">
                                                            <div class="col-xs-12">
                                                                <input type="text" class="form-control" value="<?php echo $row->area; ?>" disabled="true"/>
                                                            </div>
                                                        </div>
                                                    </td>
                                                    <td>
                                                        <div class="form-group">
                                                            <div class="col-xs-12">
                                                                <input type="text" class="form-control" value="<?php echo $row->name; ?>" disabled="true"/>
                                                            </div>
                                                        </div>
                                                    </td>
                                                </tr>
                                            <?php } ?>

                                            </tbody>
                                        </table>
                                    </div>
                                </div>
                            </div>
                            <!-- End SmartWizard Content 
                            <?php echo form_close(); ?>
                        </div>
                    </div>
                </div>
</div>
</div>
</div>

                        <!-- /page content -->
                        <!-- jQuery -->
                        <script src="<?php echo base_url('assets/js/jquery.min.js'); ?>"></script>
                        <!-- Bootstrap -->
                        <script src="<?php echo base_url('assets/js/bootstrap.min.js'); ?>"></script>
                        <!-- FastClick -->
                        <script src="<?php echo base_url('assets/js/fastclick.js'); ?>"></script>
                        <!-- NProgress -->
                        <script src="<?php echo base_url('assets/js/nprogress.js'); ?>"></script>


                        <script src="<?php echo base_url('assets/js/custom.min.js'); ?>"></script>
                        <script src="<?php echo base_url('assets/js/jquery.smartWizard.js'); ?>"></script>
                        <script src="<?php echo base_url('assets/js/jquery.validate.min.js'); ?>"></script>
                        <script src="<?php echo base_url('assets/js/jquery.dataTables.min.js'); ?>"></script>
                        <script type="text/javascript">
                            $('#wizard').smartWizard({
                                labelNext: 'Next',
                                labelPrevious: 'Previous',
                                labelFinish: 'Finish',
                                selected: 0,
                                onLeaveStep: leaveAStepCallback,
                                onFinish: onFinishCallback
                            });
                            function leaveAStepCallback(obj, context) {
                                return validateSteps(context.fromStep); // return false to stay on step and true to continue navigation 
                            }


                            function onFinishCallback(objs, context) {
                                if (validateAllSteps()) {
                                    $('#createform').submit();
                                }
                            }


                            function validateSteps(stepnumber) {
                                var isStepValid = false;
                                if (stepnumber === 1) {
                                    isStepValid = true;
                                    return isStepValid;
                                } else if (stepnumber === 2) {
                                    isStepValid = true;

                                    return isStepValid;
                                }
                            }
                            function validateAllSteps() {
                                var isStepValid = true;
                                return isStepValid;
                            }


                            //========================================== Wizard step validation end =========================================================
                            $(document).ready(function () {
                                $(".buttonFinish").remove();
                            });

                        </script>
