Question

Im having trouble trying to post data correctly using jQuery/AJAX

I have the following…

<script type="text/javascript">
    function notifyPPAComplete() {
        $.ajax(
        {
        type: "POST",
        url: "PsychometricTest.aspx/UpdateDB",
        data: {'3'},
        dataType: json,
        success: success,
        contentType: application/json
        });
    }          
    $.post('PsychometricTest.aspx/UpdateDB', function(data) {
        alert ('success');
    });
</script>

I dont seem to receive my alert after the post neither, can anybody see an obvious problem?

Answer 1

data: {'3'}

That’s an invalid javascript literal. You may try like this:

data: JSON.stringify({ model: { foo: '3' } })

Notice the usage of the JSON.stringify method which serializes a javascript literal into a JSON string. It’s natively built into modern browsers. And if you need to support legacy browsers you vould include the json2.js script.

Also contentType: application/json is pretty invalid javascript. Should be:

contentType: 'application/json'

Also: dataType: json is invalid. Should be dataType: 'json'.

So at the end of the day:

<script type="text/javascript">
    function notifyPPAComplete() {
        $.ajax({
            type: "POST",
            url: "PsychometricTest.aspx/UpdateDB",
            data: JSON.stringify({ model: { foo: '3' } }),
            dataType: 'json',
            success: function(result) {

            },
            contentType: 'application/json'
        });
    }          
</script>

would successfully post to:

[WebMethod]
public static void UpdateDB(MyModel model)
{
    ...    
}

where MyModel:

public class MyModel
{
    public string Foo { get; set; }
}