0

I have the following ajax code in my frontend.

var formData = $('#application-information-step-one').serialize();
var actionUrl = $('#application-information-step-one').attr('action');
$.ajax({
      url: actionUrl,
      type: 'POST',
      data: formData,
      success: function(data) {
        var resp = JSON.stringify(data);
        console.log(resp);
      },
      error: function(data) {

      }

And following code to return json response from my controller if the request is ajax:

        if ($request->ajax()) {
            return response()->json([
                'message' => 'Information saved sucessfully !'
            ],200)->headers('Content-Type', 'application/json');
        }

But with the above code setup. Laravel returns HTML code of same page from where the request was made.

HTML page is rendered in preview section of network tab .

Can anyone suggest what am I missing here ?

psudo
  • 1,341
  • 3
  • 24
  • 69

2 Answers2

0

Return JSON response from controller

if ($request->ajax()) {
    return response()->json([
        'status' => 'success', 
        'data' =>[], 
        'message' => 'Information saved successfully!'
    ], 200);
}

In AJAX success function code:

 success: function (data) {
     console.log(data.message);
 },

and add to AJAX request object next parameters too

dataType: 'json',
contentType: false,
processData: false
Tpojka
  • 6,996
  • 2
  • 29
  • 39
0

Check for Ajax request is incorrect, otherwise the controller wouldn't have outputted HTML.

You can try several things:

  • use Illuminate\Support\Facades\Request; at the top of the file
  • replace request->ajax() with Request::wantsJson()
  • use request()->ajax()

Any of the above subject to your Laravel version.

More details here

Silviu-Marian
  • 10,565
  • 6
  • 50
  • 72