Laravel - AJAX搜索适用于输入但不适用于选择

Question

I have been having a little problem. I am trying to create a filter for my database. So far I have come up with this:

Blade File:

<input type="text" class="form-control" id="search" name="search" placeholder="Name, NORAD or ID"></input>

<select name="filtername" id="filtername">
    <option value="none"></option>
    <option value="Falcon">Falcon</option>
    <option value="rb">R/B</option>
</select>

Javascript AJAX Call:

$(document).ready(function() {
$('#search').on('keyup', function() {
    $value = $(this).val();
    delay(function() {
        if ('#search'.length > 3) {
            $.ajax({
                type: 'get',
                url: '{{$launchsitename->site_code}}',
                data: {
                    'search': $value
                },
                success: function(data) {
                    $('#launchsatdisplay').html(data);
                }
            });
        }
    }, 300);
});

$("#filtername").change(function() {
    var filtername = $(this).val();
    var dataString = "filtername=" + filtername;
    $.ajax({
        type: "get",
        url: "{{$launchsitename->site_code}}",
        data: {
            'search': dataString
        },
        success: function(data) {
            $('#launchsatdisplay').html(data);
        }
    });
});
});

Controller:

if ($request->ajax())
    {
        $output="";
        $launchsitesatellite = DB::table('satellites')
            ->where(function($q) use ($request) {
                $q->orWhere('satname','LIKE','%'.$request->search.'%')
                  ->orWhere('norad_cat_id','LIKE','%'.$request->search.'%')
                  ->orWhere('object_id','LIKE','%'.$request->search.'%');
            })
            ->where('site', $site_code)->get();
        if ($launchsitesatellite)
        {
            $output .='<tr>'.
            '<th>'.'Satellite Name'.'</th>'.
            '<th>'.'NORAD ID'.'</th>'.
            '<th>'.'Object Type'.'</th>'.
            '<th>'.'Launch Date'.'</th>'.
            '<th>'.'Country'.'</th>'.
            '<th>'.'Object ID'.'</th>'.
            '<tr>';
            foreach ($launchsitesatellite as $key => $launchsitesatellites) {
            $output .='<tr>'.
                    '<td>'.$launchsitesatellites->satname.'</td>'.
                    '<td>'.$launchsitesatellites->norad_cat_id.'</td>'.
                    '<td>'.$launchsitesatellites->object_type.'</td>'.
                    '<td>'.$launchsitesatellites->launch.'</td>'.
                    '<td>'.$launchsitesatellites->country.'</td>'.
                    '<td>'.$launchsitesatellites->object_id.'</td>'.
                    '</tr>';
            }
        }
        return $output;
    }
    else {
        $launchsitesatellite = DB::table('satellites')->where('site', $site_code)->Paginate(40);
        return view('pages/launchsite-filter', compact('launchsites', 'launchsitesatellite'));
    }

This code is for making an AJAX call to my controller and getting the results from the database. The code posted above works perfectly for the input. I am able to search the database with ease. The only problem is with the select. Whenever I select an option, it returns no results. I am guessing there is something wrong with the way I programmed the select in my controller, as I don't think the Javascript would be causing the problem.

The select should be reading the satname column in my database called satellites and returning the filtered results.

Would somebody be able to shed some light on why the select is not working or where the error in my code is?

Answer 1

modify your ajax call code for select box as below

$("#filtername").change(function() {

    var dataString = $(this).val();
    $.ajax({
        type: "get",
        url: "{{$launchsitename->site_code}}",
        data: {
            'search': dataString
        },
        success: function(data) {
            $('#launchsatdisplay').html(data);
        }
    });
});