Question

I thought I was heading in the right direction here. But somewhere, information overload set in.

Simple task: I want to have a user select something from a drop down, and have jquery populate the form cells from that selection. The selection is sending an ID request to my ASP script, which is returning the data in a JSON format. But Jquery isn’t populating the form at all.

Here is my Jquery.

<script>
$(document).ready( function() {
    $("#list-avail-reps").change( function() {
        var rep_id = $(this).val();
        var datastring = "ID="+rep_id;
    $.ajax({
        type: "GET",
        data: datastring,
        dataType: "json",
        url: "sales-reps.asp",
        success: function(data) {
            var rep_name=json.rep_name
            var rep_cell=json.rep_cell
            var rep_email=json.rep_email
            var rep_branch=json.rep_branch
            var branch_id=json.branch_id
            $("#rep_name").val(rep_name);
            $("#rep_cell").val(rep_cell);
            $("#rep_branch").val(rep_name);
            $("#rep_email").val(rep_email);
            $("#rep_active").val('1');
            $("#rep_login_ID").val(rep_id);
            $("#branch_ID").val(branch_ID);
        }
    });//end ajax command
    }); //end of listener
});//end document function
</script>  

My JSON output is the following:

[
{
"rep_name":"Name here",
"rep_cell":"Number here",
"rep_branch":"More info",
"rep_email":"email here",
"branch_id":"5"
}
]

Any help on this would be greatly appreciated.

Answer 1

You should use data instead of json.

Example:

data.rep_email versus json.rep_email

The data that is returned appears to be an array. So you will need to iterate over your array (or assume an index of 0).

Example:

var rep_email = data[0].rep_email

or

for (var i = 0; i < data.length; i++) {
    var rep_email = data[i].rep_email;
}