Question

I am trying to get the success response to send the values from ajax into their respective fields. For whatever reason I can’t get that to happen. In the success section I am issuing a “alert(responseObject)” in which the results are in the attached image. So the data is coming back just as I want it, but I can’t get the values to populate into the matching fields.

$(document).ready(function() {
    function myrequest(e) {
        var man_part_number = $('#man_part_number').val();
        $.ajax({
            method: "GET",
            url: "includes/autofill.php",

            data: {
                man_part_number: man_part_number
            },
            success: function(responseObject) {
                alert(responseObject);
                //This alert response results is in attached image
                $('#manufacture').val(responseObject.manufacture);
                $('#model').val(responseObject.model);
                $('#type').val(responseObject.type);
            },
            failure: function() {
                alert('fail');
            }
        });
    }

    $('#fetchFields').click(function(e) {
        e.preventDefault();
        myrequest();
    });
});

<button type="button" id="fetchFields">Fetch</button>

<input type="text" name="manufacture" id="manufacture" />
<input type="text" name="model" id="model" />
<input type="text" name="type" id="type" />

Answer 1

The string returned is not JSON. Look at the end of your string in the Alert box. It has “test”. That means that the response is parsed as text by jQuery, since you don’t specify the dataType option. If you did specify it as “JSON”, it would fail because having “test” next to “{…}” is invalid JSON. I guess the point is that you need to return valid JSON, and if you are indeed expecting JSON back, set the dataType option for the $.ajax call to be “JSON”. At the same time, your server should be setting the proper header in the response anyways. It’s still better (sometimes) to specify the dataType option.

By default, if you don’t specify the dataType option, jQuery will check the headers of the response to get the Content-Type. If it matches a valid type for “JSON”, “HTML”, “Text”, “XML”, or a few others, it will attempt to parse it by that. I’m betting your response doesn’t have its headers set properly, otherwise jQuery would’ve attempted to convert it to JSON and failed. It’s probably being returned as plain text, so jQuery sees that and parses it as text…which is why it parses fine. But the responseObject you’re referencing is not an Object as you expect, because you don’t follow these procedures to ensure proper parsing.