Using JQuery AJAX to fill a table in Laravel 5.5

Question

I have a populated dropdown list in my view and when i choose one date from the list I want to fill another table with data from the database.

I created a controller method called description that takes too parameters as seen below, which returns the data that I need in JSON format

When I manualy enter the url I get the correct json response but when I try to pass the url using Ajax it does not work.

My Controller Code

public function description($car,$date)

{

    $description = DB::table("histories")
        ->where('crn',$car)
        ->where("date",$date)
        ->get();
    return json_encode($description);

}

My Route

Route::get('admin/cars/history/{car}/{date}','CarController@description');

My view

    <div class="container-fluid">
    <ol class="breadcrumb">
        <li><a href="{{url('admin')}}">Home</a></li>
        <li><a href="{{url('admin/cars')}}">Car</a></li>
        <li class="active">{{$car->crn}}</li>
    </ol>

    <div class="box box-success">
        <div class="panel">
            <div class="panel-heading"><h3>Car Details</h3></div>
            <div class="box-header with-border">

                <div class="form-group">
                    <label for="owner">Owner</label>
                    <p>{{$car->customer->name}}</p></div>

                <div class="form-group">
                    <label for="manufacturer">Manufacturer</label>
                    <p>{{$car->manufacturer}}</p></div>

                <div class="form-group">
                    <label for="model">Model</label>
                    <p>{{$car->model}}</p></div>

                <div class="form-group">
                    <label for="address">Last Visit</label>
                    <p>{{$lastservice->created_at->toFormattedDateString()}}</p></div>

                <div class="form-group">
                    <label for="">Select Date to view history records</label>
                    <select name="date" class="form-control" style="width:250px">
                        <option value="">--- Select Date ---</option>
                        @foreach ($history as $date => $value)
                            <option value="{{ $date }}">{{ $value }}</option>
                        @endforeach
                    </select>

                    <a href="{{url('admin/cars/')}}" class="btn btn-default">Back</a></div>

            </div>
        </div>

My JQuery

<script type="text/javascript">
    $(document).ready(function() {
        var results = $('#results');
        $('select[name="date"]').on('change', function() {
            var $date = $('option:selected').text();

            $.ajax({

                url: 'admin/cars/history/HNH419/'+$date,
                type: "GET",
                dataType: "json",

                success:function(response){
                    alert(response);
                }})
        })
    });
</script>

An example of my Interface

Are you getting any errors? Is it getting to the controller via Ajax just not returning anything? — Webtect
– Webtect, Commented Mar 5, 2018 at 0:28
I am testing in localhost.I am not getting any errors, actually nothing happens when I choose a date from the dropdown menu. — cs_student3438779
– cs_student3438779, Commented Mar 5, 2018 at 1:15

dilusha_dasanayaka · Accepted Answer · 2018-03-05 02:05:07Z

2

In my case, It worked when I added “localhost” in front of my ajax url.

Because there is no url like “admin/cars/history/HNH419/…” , actually there is something like “localhost/admin/cars/history/HNH419/….”

Tip: you have to use full address in address bar when you try it manually.

$.ajax({
    type:'POST',
    url: host_url+'forum/question/add',
// code continues

In my case, host_url = “localhost:8000”

edited Mar 5, 2018 at 2:05

answered Mar 5, 2018 at 0:31

dilusha_dasanayaka

1,4814 gold badges18 silver badges34 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

cs_student3438779 Over a year ago

Thank you. It was in fact an issue with the url. I replaced the url with url: "{{$car->crn}}" +"/" + $date, and I am getting the correct json response

Collectives™ on Stack Overflow

Using JQuery AJAX to fill a table in Laravel 5.5

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related