autocomplete and $.getJSON problem

I have a script:

<script type="text/javascript">
$(document).ready(function(){
    $("#PrincipleMember_IdNumber").autocomplete({
        close: function(event, ui) {
            var member = {};
            member.IDNumber = $("#PrincipleMember_IdNumber").val();开发者_高级运维
            $.getJSON("<%= Url.Action("MemberLookup","Member") %>", member, function(data) {
                $("#PrincipleMember_Firstname").val(data.FirstName);
            });
        }
    });
});

A form:

<fieldset class="fieldsetSection">
<legend>Principle Member</legend>
<table>
    <tr>
        <td width="150px" class="editor-label"><%=Html.LabelFor(l=>l.PrincipleMember.IdNumber)%></td>
        <td class="editor-field"><%= Html.AutoCompleteTextBoxFor(i => i.PrincipleMember.IdNumber, "IdNumber", "AutoComplete")%></td>
        <td><%=Html.ValidationMessageFor(v => v.PrincipleMember.IdNumber)%></td>
    </tr>
    <tr>
        <td width="150px" class="editor-label"><%=Html.LabelFor(l=>l.PrincipleMember.Firstname)%></td>
        <td class="editor-field"><%=Html.TextBoxFor(t => t.PrincipleMember.Firstname)%></td>
        <td><%=Html.ValidationMessageFor(v => v.PrincipleMember.Firstname)%></td>
    </tr>
</table>

and finally a json result action:

public JsonResult MemberLookup(Member member)
{
    member = _memberRepository.GetMember(member.IDNumber);
    return this.Json(member);
}

my json result is executed perfectly and i get a result, but for some reason this section of the script is not executing: $("#PrincipleMember_Firstname").val(data.FirstName);

i've tried replacing it with an alert();, but that too is not executing.

Can anyone see what i am doing wrong here?

My best guess is (assuming that your server-side method is definitely executing successfully, and returns a 200 OK ) that your data object might not have a FirstName property.

If you use Firefox, then get FireBug, and check the value of the data object. If you're using Chrome - check the developer console (Ctrl + Shift + I)

Replace $("#PrincipleMember_Firstname").val(data.FirstName); with console.log(data); and check the javascript console (firebug's console tab, or Chrome's developer console -> console tab. You should be able to see your object, and any js errors that you might have.

If the object returns fine - try console.log(data.FirstName);

If the object isn't in the console - then your success method isn't executing. Maybe the server-side call isn't successful - try replace it with a $.ajax call, and use the error event to see what's wrong.

Also, if console.log returns undefined - your method call result probably didn't return a valid json object, though I think that'd be highly unlikely, looking at your code.

I had to change my json result:

return this.Json(member, JsonRequestBehavior.AllowGet);