Laravel - select dropdowns that filter results in a table 'on change'

Question

Hi there,

I am working on an application that features a data table containing details of different tours. Above the table there are some dropdowns to filter results by criterion, e.g. 'Tour Name', 'Region', 'Dates', 'Category' etc. I would like the to fire off a MYSQL query to filter the results as the user clicks on a specified option in the select dropdown - without the user having to click on a submit button - and the results to be displayed automatically to the page. But I cannot seem to find a way to pass the 'id' parameter to the laravel route (contained in the form action), which saves the option that the user chooses in the select dropdown.

(By the way I have ruled out the possibility of using AJAX, as the table contains 'Edit' and 'Delete' buttons for each entry, which pass parameters to other routes via PHP, and these would have to change upon retrieval of the new data).

My code so far uses JQuery to submit the form 'on menu change':

// index.blade.php

                    <form name="_token" action="{{ route('bookings.toursDropDown', $tour->id) }}" id="tour-dropdown" method="get" value="<?php echo csrf_token(); ?>">
                    {!! csrf_field() !!}
                        <select id="tour">                      
                            <option value="">All</option>
                            @foreach ($tours as $tour)
                                <option value="{!! $tour->id !!}">{!! $tour->name !!}</option>
                            @endforeach
                        </select>
                    </form>
                </td>

<script>

            function dataFilter(id){
                $(id).on('change', function(e){

                    var variable = e.target.value;

                    $(id + '-dropdown').submit();

                });
            };

            dataFilter('#tour');

            dataFilter('#category');

            dataFilter('#region');

            dataFilter('#dates');

</script>

This is my routes file: // web.php (routes)

Route::get('/tours-dropdown/{id}', ['as' => 'bookings.toursDropDown', 'uses' => 'BookingsController@toursDropDownData']);

This is the file that runs the query and returns a results set to the view: //BookingsController.php

 public function toursDropDownData(int $id)
    {
       // Grabs the tour id from the select dropdown and runs query selecting all the results for the specified tour
       $tour_id = intval($id);

       if($tour_id != ''){

           $bookings = auth()->user()->bookings()->join('holidaytours', 'bookings.tour_id', '=','holidaytours.id')
            ->join('datedtours', 'bookings.datedtour_id', '=', 'datedtours.id')->join('categories', 'bookings.category_id', '=', 'categories.id')->join('continents', 'holidaytours.continent_id', '=', 'continents.id')->select('bookings.*', 'holidaytours.name AS tour_name', 'datedtours.datedtourstartdate', 'datedtours.datedtourenddate', 'datedtours.spaces', 'categories.name AS category_name', 'continents.name AS continent_name')->where('holidaytours.id', '=', $tour_id)->get();

        } else {

            $bookings = auth()->user()->bookings()->join('holidaytours', 'bookings.tour_id', '=','holidaytours.id')
            ->join('datedtours', 'bookings.datedtour_id', '=', 'datedtours.id')->join('categories', 'bookings.category_id', '=', 'categories.id')->join('continents', 'holidaytours.continent_id', '=', 'continents.id')->select('bookings.*', 'holidaytours.name AS tour_name', 'datedtours.datedtourstartdate', 'datedtours.datedtourenddate', 'datedtours.spaces', 'categories.name AS category_name', 'continents.name AS continent_name')->get();

            //Returns the matching dated tours in an array via json.
        }

        return Redirect::route('bookings.index')->with('bookings', $bookings);

    }

I cannot seem to pass a parameter into the toursDropDownData function, or the bookings.toursDropDown route.

Upon loading the index page, I receive the error:

Undefined variable: tour (View: C:\xampp3\htdocs\laravel\resources\views\bookings\index.blade.php)

Any advice would be greatly appreciated!

Thanks,

Regards, Robert

London, UK

Welcome to the Treehouse Community

Looking to learn something new?

Robert Young

Robert Young

Laravel - select dropdowns that filter results in a table 'on change'