'jQuery ajax POST, error 'SyntaxError: Unexpected end of JSON input'

Im sure im missing something simple, but so far struggling to see what...

I am wanting to POST some form field entries to a server in JSON format. I am currently using:

$(document).ready(function () {
    $("#newEnquiery").submit(function (event) {     
        event.preventDefault(); 
        $.ajax({
            url: 'SERVER-URL-HERE',
            type: 'POST',
            data: JSON.stringify({ "name": $('#name').val(), "emailAddress" : $('#emailAddress').val(), "address" : $('#address').val() }),
            contentType: 'application/json; charset=utf-8',
            dataType: 'json',
            success: function(data, textStatus, jQxhr){
                console.log('Sent');
            },
            error: function( jqXhr, textStatus, errorThrown ){
                console.log('fail');
                console.log(errorThrown);
            }
        });
    });
});

The error that I am being shows in the console is; SyntaxError: Unexpected end of JSON input



Solution 1:[1]

$.ajax({
    url: "https://jsonplaceholder.typicode.com/posts",
    type: "POST",
    data: JSON.stringify({
        name: "test",
        emailAddress: "test",
        address: "test",
    }),
    contentType: "application/json",
    dataType: "json",
    success: function (data, textStatus, jQxhr) {
        console.log(data);
    },
    error: function (jqXhr, textStatus, errorThrown) {
        console.log("fail");
        console.log(errorThrown);
    },
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

contentType has to be application/json and you should pass a plain json into the JSON.stringify method into the data attribute. So the code has to be:

    $(document).ready(function () {
    $("#newEnquiery").submit(function (event) {     
        event.preventDefault(); 
        $.ajax({
            url: 'SERVER-URL-HERE',
            type: 'POST',
            data: JSON.stringify({ name: $('#name').val(), emailAddress : $('#emailAddress').val(), address : $('#address').val() }),
            contentType: 'application/json',
            dataType: 'json',
            success: function(data, textStatus, jQxhr){
                console.log('Sent');
            },
            error: function( jqXhr, textStatus, errorThrown ){
                console.log('fail');
                console.log(errorThrown);
            }
        });
    });
});

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1