Laravel Dependent Dropdown with Ajax

I Need a Cascading Dropdown for my admin panel, where the dropdown values come from database. [[ example: https://prnt.sc/lccqc4 ]] I need to be work like this: https://prnt.sc/lccq7o

When I select Route no, the values of other dropdown will show related pickpoint names of that selected route. This is my ajax code I have written in php file (app-admin.blade.php):

$(document).ready(function() {

    $(document).on('change', '.selectRouteNo', function() {

        var route_id = $(this).val();
        var div = $(this).parent();

        var op = " ";

        $.ajax({
            type: "GET",
            url: '{!!URL::to(' / admin / allteacher / create / ')!!}',
            data: {
                'id': route_id
            },
            dataType: "JSON",
            success: function(data) {
                alert('Data Found');
                op += '<option value="0" selected disabled>Select Pick Point</option>';
                for (var i = 0; i < data.length; i++) {
                    op += '<option value="' + data[i].id + '">' + data[i].stoppagePoint + '</option>';
                }


                div.find('.stoppagePoint').html(" ");
                div.find('.stoppagePoint').append(op);
            },
            error: function() {
                alert('Data Not Found');
            }
        });
    });
});

My controller is like that:

    public function create(){
        return view('allteacher.create')
            ->with('allRoutes', AllRoute::all())
            ->with('allDepartments', AllDepartment::all());
    }

    public function findRouteById($id){
        $data=Product::select('routeNo','id')
            ->where('stoppagePoint',$request->id)
            ->get();

        return response()->json($data);
    }

This Is My Create (DropDown Form) Page:

<div class="col-md-4">
    <div class="fire_select2 fire_select">
        <label>Route No</label>
        <select name="routeNo" id="selectRouteNo" class="selectRouteNo" required>
            <option value="">Select Route No.</option>
            @foreach($allRoutes as $route)
                <option value="{{ $route->routeNo }}">{{ $route->routeNo }}</option>
            @endforeach
        </select>
    </div>
</div>
<div class="col-md-4">
    <div class="fire_select2 fire_select">
        <label>Pick Point</label>
        <select name="pickPoint" id="selectPickPoint" class="routeClass" required>
            <option value="">Select Pick Point</option>
        </select>
    </div>
</div>