<script src="<?php echo THEME_PATH; ?>plugins/jquery-validation/js/jquery.validate.min.js"></script>
<div class="modal fade" id="floor_modal" data-backdrop="static" tabindex="-1" role="dialog" aria-hidden="true">
    <div class="modal-dialog modal-sm">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title"> <?php echo CommonLanguage::getMessage('floor'); ?></h5>
            </div>
            <div class="modal-body">
                <form id="floor_form" method="POST" onsubmit="return false">
                    <div class="row">
                        <?php echo Forms::AlertDiv('floor_alert'); ?>
                        <input type='hidden' name='floor_flag' id='floor_flag' />
                        <input type='hidden' name='floor_id' id='floor_id' />
                        <div class="col-md-12 m-t-10 ">
                            <div class="input-group ">
                                <span class="input-group-addon inventory complete">
                                    <i class="fa fa-users"></i>
                                </span>
                                <input type="text" placeholder="<?php print CommonLanguage::getMessage('floor_name'); ?>" id="floor_name" name="floor_name" class="form-control " required>
                            </div>
                        </div>
                        <div class="col-md-12 m-t-10 <?php echo smc_session()['default_setting']['enable_user_floors'] == 1 ? '' : 'hidden'; ?>">
                            <div class="input-group ">
                                <span class="input-group-addon inventory complete">
                                    <i class="fa fa-users"></i>
                                </span>
                                <input id="employee_id" type="hidden" class="full-width" name="employee_id" value='' data-select-name=''>
                            </div>
                        </div>
                    </div>
                </form>
            </div>
            <div class="modal-footer">
                <button class="btn btn-default" data-dismiss="modal"><?php print CommonLanguage::getMessage('Close'); ?></button>
                <button class="btn btn-primary" id="submit_floor"><?php print CommonLanguage::getMessage('Save'); ?></button>
            </div>
            <?php echo Forms::ModalLoader('FloorDisabler'); ?>
        </div>
    </div>
</div>
<script>
    $(function() {
        build_select2($("#employee_id"), "xhr/employeeSearch", 1);

        $(".new_floor_btn").on("click", function() {
            $("#floor_flag").val(0);
        });
        $("#tableWithSearch").on("click", ".edit_floor", function() {
            var floor_id = $(this).parents('div.Action').attr('data-id');
            var employee_ids = $(this).attr('employee-id').split(",");
            var employee_names = $(this).attr('employee-name').split(",");


            var grid = [];
            for (var i = 0; i < employee_ids.length; i++) {
                var name = employee_names[i];
                var id = employee_ids[i];
                grid[i] = {}; // must initialize the sub-object, otherwise will get 'undefined' errors
                grid[i]['id'] = {}; // must initialize the sub-object, otherwise will get 'undefined' errors
                grid[i]['text'] = {}; // must initialize the sub-object, otherwise will get 'undefined' errors
                grid[i]['id'] = id;
                grid[i]['text'] = name;

            }



            $('#employee_id').select2('val', []); 
            $('#employee_id').data().select2.updateSelection(grid);

            $("#floor_flag").val(1);
            $("#floor_id").val(floor_id);
            $("#floor_name").val($(this).parents('tr').find('td:eq(0)').html());
        });
        $("#submit_floor").on("click", function() {
            if (!$("#floor_form").valid())
                return;
            $("#FloorDisabler").removeClass('hidden');
            var Data = new FormData(document.getElementById("floor_form"));
            Data.append('employee_id', $('#employee_id').val());

            $.ajax({
                url: "RestaurantAjax/submitfloor",
                method: "POST",
                data: Data,
                processData: false,
                contentType: false,
                dataType: "JSON",
                complete: function(jqXHR, status) {
                    if (status == 'success') {
                        if (jqXHR.responseJSON[1] == "success") {
                            RebuildDataTable(title, [0], 'RestaurantAjax/floors_list');
                            hideModalAlert('floor_modal', 'floor_alert');
                        }
                        AddAlert("#floor_alert", jqXHR.responseJSON[0], jqXHR.responseJSON[1]);
                    }
                    $("#FloorDisabler").addClass('hidden');
                }
            });
        });
    });
</script>