Ndtyjky

I trying to autofill my form with cnic which i set as unique. If Cnic exists then all fields against the entered cnic with autofill. how i will do that? I have uploaded my form , jquery and controller. If you need more data to understand you can ask. I am getting data but form is not filling with ajax request. how to resolve this issue?

My form:

<form class="form" method="post" action="{{route('add.member')}}">

    <input type="hidden" name="_token" value="{{csrf_token()}}">

    <div class="row justify-content-md-center">

        <div class="col-md-6">

            <div class="form-body">

                <div class="row">

                    <div class="col-md-6">

                        <div class="form-group">

                            <label for="name">Name</label>

                            <input type="text" id="name" class="form-control" placeholder="Enter Name" name="name" value="{{old('name')}}">

                            @if ($errors->has('name'))

                            <span style="color: red" class="help-block">{{ $errors->first('name') }}</span>

                            @endif

                        </div>

                    </div>

                    <div class="col-md-6">

                        <div class="form-group">

                            <label for="cnic">CNIC</label>

                            <input type="number" id="cnic" class="form-control" placeholder="Enter CNIC" name="cnic" value="{{old('cnic')}}">

                            @if ($errors->has('cnic'))

                            <span style="color: red" class="help-block">{{ $errors->first('cnic') }}</span>

                            @endif

                        </div>

                    </div>

                </div>

                <div class="row">

                    <div class="col-md-6">

                        <div class="form-group">

                            <label for="mobile_number">Mobile Number</label>

                            <input type="number" id="mobile_number" class="form-control" placeholder="Enter Mobile Number" name="mobile_number" value="{{old('mobile_number')}}">

                            @if ($errors->has('mobile_number'))

                            <span style="color: red" class="help-block">{{ $errors->first('mobile_number') }}</span>

                            @endif

                        </div>

                    </div>

                    <div class="col-md-6">

                        <div class="form-group">

                            <label for="party_joining_year">Party Joining Year</label>

                            <input type="text" id="party_joining_year" class="form-control" placeholder="Enter Party Joining Year" name="party_joining_year" value="{{old('party_joining_year')}}">

                            @if ($errors->has('party_joining_year'))

                            <span style="color: red" class="help-block">{{ $errors->first('party_joining_year') }}</span>

                            @endif

                        </div>

                    </div>

                </div>

                <div class="row">

                    <div class="col-md-6">

                        <div class="form-group">

                            <label for="qualification">Qualification</label>

                            <input type="text" id="qualification" class="form-control" placeholder="Enter Qualification" name="qualification" value="{{old('qualification')}}">

                            @if ($errors->has('qualification'))

                            <span style="color: red" class="help-block">{{ $errors->first('qualification') }}</span>

                            @endif

                        </div>

                    </div>

                    <div class="col-md-6">

                        <div class="form-group">

                            <label for="party_position">Party Position</label>

                            <input type="text" id="party_position" class="form-control" placeholder="Enter Party Position" name="party_position" value="{{old('qualification')}}">

                            @if ($errors->has('party_position'))

                            <span style="color: red" class="help-block">{{ $errors->first('party_position') }}</span>

                            @endif

                        </div>

                    </div>

                </div>

                <div class="form-group">

                    <label for="profession">Profession</label>

                    <input type="text" id="profession" class="form-control" placeholder="Enter Profession" name="profession" value="{{old('qualification')}}">

                    @if ($errors->has('profession'))

                    <span style="color: red" class="help-block">{{ $errors->first('profession') }}</span>

                    @endif

                </div>

                <div class="form-group">

                    <label for="district">District/Tahseel</label>

                    <input type="text" id="district" class="form-control" placeholder="Enter District" name="district" value="{{old('qualification')}}">

                    @if ($errors->has('district'))

                    <span style="color: red" class="help-block">{{ $errors->first('district') }}</span>

                    @endif

                </div>

            </div>

        </div>

    </div>

</form>

Ajax:

$("#cnic").focusout(function(e){

        // alert($(this).val());

        var cnic = $(this).val();

        $.ajax({

            type: "POST",

            url: "{{route('get.all.fields')}}",

            data: {'cnic':cnic},

            dataType: 'json',

            success : function(e) {

                if(e===0){

                    $('.flash-message').html('Data not found');

                    $('#cnic').val('');

                }

                else {

                    $('.flash-message').html('');

                    r = $.parseJSON(e); //convert json to array

                    $('#name').autocomplete({

                        source: r.name,

                    }); //assign name value

                    $('#mobile_number').autocomplete({

                        source: r.mobile,

                    }); //assign email value

                    $('#party_joining_year').autocomplete({

                        source: r.party_joining_year,

                    }); //assign department value

                    $('#qualification').autocomplete({

                        source: r.qualification,

                    }); //assign department value

                    $('#party_position').autocomplete({

                        source: r.party_position,

                    }); //assign department value

                    $('#profession').val(r.profession).autocomplete({

                        source: r.profession,

                    }); //assign department value

                    $('#district').val(r.profession).autocomplete({

                        source: r.district,

                    }); //assign department value

                    $("#cnic").html(e);



                }

            }

        });

    });



</script>

My Controller:

 public function getAllFields(Request $request)

{

    $getFields = Member::where('cnic', $request->get('cnic'))->get(['name','mobile','party_joining_year','qualification','party_position','profession','district']);

    return json_encode($getFields[0]['mobile']);

}

Route:

  Route::post('/get_fields', 'MemberController@getAllFields')->name('get.all.fields');

In your controller you should be returning a proper JSON response

public function getAllFields(Request $request)

{

    try {

        $getFields = Member::where('cnic',$request->cnic)->first();

        // here you could check for data and throw an exception if not found e.g.

        // if(!$getFields) {

        //     throw new Exception('Data not found');

        // }

        return response()->json($getFields, 200);

    } catch (Exception $e) {

        return response()->json([

            'message' => $e->getMessage();

        ], 500);

    }

}

You shouldn't need to parse the json as

 dataType: 'json'

will automatically expect JSON and the response variable will already be an object and you just need to map it like

$("#cnic").focusout(function(e){

    // alert($(this).val());

    var cnic = $(this).val();

    $.ajax({

        type: "POST",

        url: "{{route('get.all.fields')}}",

        data: {'cnic':cnic},

        dataType: 'json',

        success : function(data) {

            $('#name').val(data.name); 

            $('#mobile_number').val(data.mobile); 

            $('#party_joining_year').val(data.party_joining_year);

            ...

        },

        error: function(response) {

            alert(response.responseJSON.message);

        }

    });

});

You must read the laravel docs carefully. you don't need to get the inputs if you want a row from db.

The ->get() method returns an array of al the matched rows.
The ->first() method returns only the first row that matches the where clause.

So you must first correct the eloquent query. If you want to specify the columns that you want to retrieve from the database you must use the ->select method. But I don't see any reason to do that. so your controller must look like this:

 public function getAllFields(Request $request)

{

    $getFields = Member::where('cnic',$request->get('cnic'))->first();

    return json_encode($getFields);

}

After that, you must decode the JSON array with jquery and add the values one by one.

$("#cnic").focusout(function(e){

        // alert($(this).val());

        var cnic = $(this).val();

        $.ajax({

            type: "POST",

            url: "{{route('get.all.fields')}}",

            data: {'cnic':cnic},

            dataType: 'json',

            success : function(e) {

                if(e.length === 0){

                    $('.flash-message').html('Data not found');

                    $('#cnic').val('');

                }

                else {

                    $('.flash-message').html('');

                    r = $.parseJSON(e); //convert json to array

                    $('#name').val(r.name); 

                    $('#mobile_number').val(r.mobile); 

                    $('#party_joining_year').val(r.party_joining_year)



                     and so on...



                    $("#cnic").html(e); //-> I dont realy understand why you use this part of code?



                }

            }

        });

});

Remember: you must get the fields from "r" object exactly by the name of database column that you retrieve the data.