@include('cabMeAdmin.datatable.datatable_script')
<div class="row">
    <div class="col-md-12">
        <div class="box box-info">
            <div class="box-header">
{{--                Search Locations...--}}
                <br><br>
                <div class="box-tools">
                    <div class="btn-group pull-right" style="margin-right: 5px">
                        <a href="{{ url('/') }}/admin/manage_location/surcharges/add_surcharge" class="btn btn-sm btn-success" title="Add"><i class="fa fa-plus"></i><span class="hidden-xs">&nbsp;Add New</span></a>
                    </div>
                </div>
                <div class="filterOption">
                    <div class="form-group">
                        <div class="col-sm-2"></div>
                        <div class="col-sm-1">
                            <label><h4>Search:</h4></label>
                        </div>
                        <div class="col-sm-6">
                            <select id="location_for" name="location_for" class="form-control" required="1" style="font-weight: bold;">
                                <option value="AirportSurcharge" selected>Airport Surcharge</option>
                                <option value="LocationWiseFare">Location Wise</option>
                            </select>
                        </div>
                        <div class="col-sm-3"></div>
{{--                        <div class="col-sm-5">--}}
{{--                            <input type="text" id="location" name="location" value="" class="form-control" placeholder="Enter Location" required="1">--}}
{{--                        </div>--}}
                    </div>
                </div>
            </div>
            <br>
            <div class="form-group">
                <div class="col-md-4">
                </div>
                <div class="col-md-2">
                    <div class="btn-group pull-left">
                        <button type="button" class="btn btn-primary" onclick="loadDataTable()">Search</button>
                    </div>
                </div>
                <div class="col-md-2">
                    <div class="btn-group pull-right">
                        <button type="button" class="btn btn-warning" onclick="resetData()">Reset</button>
                    </div>
                </div>
                <div class="col-md-4">
                </div>
            </div>
            <br>
            <br>
            <!-- /.box-header -->
            <div class="box-body">
                <div class="fields-group">
                    <div class="form-group  ">
                        <div class="col-lg-12">
                            <table class="table" id="table">
                                <thead>
                                <tr>
                                    <th class="text-center">Id</th>
{{--                                    <th class="text-center">Location For</th>--}}
                                    <th class="text-center">Location Name</th>
                                    <th class="text-center">Surcharge</th>
                                    <th class="text-center">Action</th>
                                </tr>
                                </thead>
                                <tbody>
                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>
            </div>
            <div class="box-footer">
                <input type="hidden" name="_token" value="{{ csrf_token() }}">
            </div>
        </div>
    </div>
</div>
<script>
    $(document).ready(function() {
        loadDataTable();
    } );
    function resetData()
    {
        var type = $('#location_for').val('AirportSurcharge');
        loadDataTable(type);
    }

    $(document).on('change','#location_for',function () {
        var type = $(this).val();
        loadDataTable(type)

    });
    function loadDataTable(type = '')
    {
        var base_url = '