Trailing html with ajax response form php

I am trying to send info to a php file from an html form. The form works just fine and php processes the information correctly but I am having trouble with the response from the callback.

Here is the javascript code:

function jvsSubmit(fd){
var submitUrl = 'repeater_field_capture.php';

$.ajax({
    type:'post',
    url: submitUrl,
    data: fd,
    contentType: false,
    processData: false,
    success: function(response){ submit_settings_form_callback(response); },
});
}
function submit_settings_form_callback(data){



console.log(data);
}

JavaScript
​x
 
function jvsSubmit(fd){var submitUrl = 'repeater_field_capture.php';​$.ajax({    type:'post',    url: submitUrl,    data: fd,    contentType: false,    processData: false,    success: function(response){ submit_settings_form_callback(response); },});}function submit_settings_form_callback(data){​​​console.log(data);}​

Here is the php code:

if(isset($_POST['formInfo']))
{
update_option('text',$_POST['text']);

$return = ['success' => 1, 'message' => 'Message Sent'];

echo json_encode($return);

JavaScript
 
if(isset($_POST['formInfo'])){update_option('text',$_POST['text']);​$return = ['success' => 1, 'message' => 'Message Sent'];​echo json_encode($return);​

}

Everything works fine except for the response from the call back. Here is what I see when I console log the data from the callback.

{"success":1,"message":"Message Sent"}<!doctype html>
<html lang="en-US" >
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Page not found – DB Website Projects</title>
<meta name='robots' content='max-image-preview:large' />
<link rel='dns-prefetch' href='//s.w.org' />
<link rel="alternate" type="application/rss+xml" title="DB Website Projects &raquo; 
Feed" href="https://projects.db-websites.com/feed/" />
<link rel="alternate" type="application/rss+xml" title="DB Website Projects &raquo; 
Comments Feed" href="https://projects.db-websites.com/comments/feed/" />
    <script>
        window._wpemojiSettings =........

JavaScript
 
{"success":1,"message":"Message Sent"}<!doctype html><html lang="en-US" ><head><meta charset="UTF-8" /><meta name="viewport" content="width=device-width, initial-scale=1" /><title>Page not found – DB Website Projects</title><meta name='robots' content='max-image-preview:large' /><link rel='dns-prefetch' href='//s.w.org' /><link rel="alternate" type="application/rss+xml" title="DB Website Projects &raquo; Feed" href="https://projects.db-websites.com/feed/" /><link rel="alternate" type="application/rss+xml" title="DB Website Projects &raquo; Comments Feed" href="https://projects.db-websites.com/comments/feed/" />    <script>        window._wpemojiSettings =........​

As you can see the json object is there but there are some trailing html that is causing an issue.

Answer

You can stop the execution of the rest of your PHP script by adding die() or exit() after the echo json_encode($return); line.

Advertisement

Answer