未定义的AJAX“数据”属性

Question

I am trying to update some text within <span> fields on a parent form via a modal. To do this I am using an AJAX call on the modal form to retrieve the new user entered values. Once the "Save" button is clicked, the modal form should retrieve the textbox values and send them back.

However I am unable to pass any values back. When debugging in the function that creates a Javascript array, the values exist and are correct. However once I try to use the data property of the AJAX call (ex: data.Address), it returns undefined.

Here is my code for the AJAX call:

     $.ajax({
        type: 'POST',
        data:
            {
                ID: $("#[e-mail]").val(),
                Address1: $("#[e-mail]").val(),
                Address2: $("#[e-mail]").val(),
                City: $("#[e-mail]").val(),
                Province: $("#[e-mail]").val(),
                PostalCode: $("#[e-mail]").val(),
                PhoneNumber: $("#[e-mail]").val()
            },
        success: function (data) {
            //$("#[e-mail]").html(data.Address1);

            alert(data); //prints the entire HTML for the form
            alert(data.ID); //prints undefined
            alert($("#[e-mail]").val()); //prints the correct value - 2827
            alert("Data logged!");
        },
        error: function (data) {
            alert("Error occurred!");
        }
    });

Answer 1

If you are not sending the correct header from the server that say is json you must specified in the ajax object that the response is json try adding the dataType

 $.ajax({
    type: 'POST',
    dataType:'json',
    data: getModelData(),
    success: function (data) {
        //$("#[e-mail]").html(data.Address1);
        alert(data[0].Address1);
    },
    error: function (data) {
        alert("Error occurred!");
    }
});

Or in the server specified the content type application/json