<button class="btn btn-xs btn-success" id="manage-column" type="button">
    <i aria-hidden="true" class="fa fa-columns">
    </i>
    <span class="hidden-sm hidden-xs">
        Columns
    </span>
</button>
<div class="modal fade" id="modal-manage-column">
    <div class="modal-dialog modal-md">
        <div class="modal-content">
            <div class="modal-header">
                <button aria-hidden="true" class="close" data-dismiss="modal" type="button">
                    <i class="fa fa-times-circle">
            </i>
                </button>
                <h4 class="modal-title">
                    Manage Columns
                </h4>
            </div>
            <div class="modal-body clearfix">
                <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12 col3 manage-column">
                    {!!Form::horizontal_open()
                    ->id('form-manage-column')
                    ->method('POST')
                    ->files('true')
                    ->action(guard_url('/settings/settings'))!!}

                    {!!Form::checkboxes('manage_columns')
                    ->checkboxes(trans('game::game.cloumns'))
                    ->inline()
                    ->raw()!!}

                    {!!Form::close()!!}
                </div>
            </div>
            <div class="modal-footer">
                <button class="btn btn-success" id="save_columns_settings" type="button">
                    <i class="fa fa-check-circle aria-hidden=" true""="">
                    </i>
                    Save
                </button>
                <button class="btn btn-primary" id="btn-reset-column" type="button">
                    <i aria-hidden="true" class="fa fa-refresh">
                    </i>
                    Reset
                </button>
                <button class="btn btn-default" data-dismiss="modal" type="button">
                    <i aria-hidden="true" class="fa fa-times-circle">
                    </i>
                    Close
                </button>
            </div>
        </div>
    </div>
</div>
<script type="text/javascript">
    $('#manage-column').click(function(){
        $('#modal-manage-column').modal('show');
    });
    
    $('#btn-reset-column').click(function(){
        $('#form-manage-column')[0].reset(); 

        $('#form-manage-column input[type=checkbox]').each( function () {
            var column = oTable.api().column( $(this).attr('data-column') );
            console.log($(this).attr('data-column'));
            if ($(this).prop('checked')) {
                column.visible( true );
            }else{
                column.visible( false );
            }
        });
    });
  

    $('.manage-column input[type=checkbox]').change(function(){
        var column = oTable.api().column( $(this).attr('data-column') );
        if ($(this).prop('checked')) {
            column.visible( true );
        }else{
            column.visible( false );
        }
    });

    $("#save_columns_settings").click(function(){
        toastr.info('This feature will be enabled soon.', 'Coming soon');
        $('#modal-manage-column').modal('hide');
        return false;
        var formData = new FormData();
        formData.append('value', $('#form-manage-column').serialize());
        formData.append('key', 'game.game.column');
        formData.append('package', 'Game');
        formData.append('module', 'Game');
        formData.append('name', 'Column');
        $.ajax({
            url : "{!!guard_url('/settings/setting')!!}",
            type: "POST",
            data: formData,
            cache: false,
            processData: false,
            contentType: false,
            success:function(data, textStatus, jqXHR)
            {
                $('#modal-manage-column').modal('hide');
            },
            error: function(jqXHR, textStatus, errorThrown)
            {
                toastr.error('An error occurred while creating.', 'Error');
                console.log(jqXHR);
                console.log(textStatus);
                console.log(errorThrown);
            }
        });

    });
</script>