Jquery Ajax response in Laravel

Question

I am new to jquery ajax and try to develop system with jquery ajax in laravel. I've coded all the thing as below. analysis.blade.php

<table id="grn_for_MC">
                <tr>
                    <td width="40%">GRN</td>
                    <td>
                        <select name="grn-one" id="grn-one" class="input-sm dynamic" data-dependant="new-supply-data">
                            <option value="">Select GRN</option>
                            @foreach($grn_list as $grn_lists)
                            <option value="{{$grn_lists->id}}">{{$grn_lists->grn_no}}</option>
                            @endforeach
                        </select>
                    </td>
                </tr>
                <tr>
                    <td>Supply Date</td>
                    <td id="load-supply-date">14/02/2020</td>
                </tr>
                <tr>
                    <td>Supplier Name</td>
                    <td id="load-supplier">Mahesh Lowe</td>
                </tr>
                <tr>
                    <td>Quantity Supplied</td>
                    <td id="load-qty">10000.00kg</td>
                </tr>
                <tr>
                    <td>No of Bags</td>
                    <td id="load-no-of-bags">20</td>
                </tr>
            </table>

TestController.php

public function show($id)
{
    $grnData = DB::table('grns')->WHERE('id',$id)->get();
    return response()->json($grnData);
}

web.php...

Route::POST('/getGrnData/{id}','TestController@show')

script..

<script>
    $(document).ready(function(){
        $.ajaxSetup({
            headers: {
                'X-CSRF-TOKEN': $('meta[name="_token"]').attr('content')
            }
        });
        $('select#grn-one').on('change',function(e){
            var selected_grn_id = $(this).children("option:selected").val();
            $.ajax({
                type:"POST",
                dataType:"json",
                url:'/getGrnData/'+selected_grn_id,
                success:function(response){
                    console.log(response);
                    $('#load-supply-date').val(response.supply_date);
                    $('#load-supplier').val(response.supplier_name);
                }
            })
        });
    });
</script>

Problem is over here, $('#load-supply-date').val(response.supply_date);

Response is passing well to ajax request. But when I am trying to pass response data to view from jquery nut it is not showing data in table. Anybody help me to how to do it?

Answer 1

You are trying to access proprety supply_date on an array of object(s)

Just replace

public function show($id)
{
    $grnData = DB::table('grns')->WHERE('id',$id)->get(); // ==> returns a collection of object(s) : [{}]
    return response()->json($grnData);
}

to

public function show($id)
{
    $grnData = DB::table('grns')->where('id',$id)->first(); // returns single object : {}
    // or even better you may use $grnData = DB::table('grns')->find($id);
    return response()->json($grnData);
}