CODEWITHSUNDEEP
jqueryajaxlaravel-8
abu abu
abu abu

Reputation: 7052

AJAX request to Controller function

How to send AJAX request to Controller function?

My jQuery code is like below

$( document ).ready(function() {
            $( ".ri-remote-control-line" ).click(function() {
                var lockID = this.id;   //I am getting value here

                $.ajax({
                    headers: {
                        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                    },
                    url: '/unlock/{lockID}',
                    type: "GET",
                    dataType: "JSON",
                    processData: false,
                    contentType: false,
                    data: { lockID : lockID },
                    success: function (data, status)
                    {
                        console.log(data);
                    },
                    error: function (xhr, desc, err)
                    {
                        console.log(xhr);
                    }
                });  
            });
        });

My Route is like below

Route::get('/unlock/{lockID}', [DashboardController::class, 'unlock'])->name('unlock');

My function unlock of DashboardController is like below

public function unlock (Request $request) 
    {
        return response()->json($request->lockID);
    }

But I am getting output {lockID}.

Upvotes: 0

Views: 53

Answers (1)

Hirak Sheth
Hirak Sheth

Reputation: 359

I found issue in your ajax. I have fixed it. I have corrected url of ajax and remove data.

$( document ).ready(function() {
    $( ".ri-remote-control-line" ).click(function() {
        var lockID = this.id;   //I am getting value here

        $.ajax({
            headers: {
                'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
            },
            url: '/unlock/'+lockID,
            type: "GET",
            dataType: "JSON",
            processData: false,
            contentType: false,
            success: function (data, status)
            {
                console.log(data);
            },
            error: function (xhr, desc, err)
            {
                console.log(xhr);
            }
        });  
    });
});

Upvotes: 1

Related Questions