使用AJAX更新文本框

Question

When a dropdown's value changes, I need the values of two textboxes to change, based on the new value of the dropdown, without refreshing the page.

This should be dead easy, but I'm having trouble figuring out what makes AJAX tick. I seem to be able to get the value, but I can't set the textbox.

This similar question didn't help me. Neither did this.

JavaScript:

// Dropdown ID = PatientID, textbox ID = DoB
var patient = $("#PatientID");
patient.change(function () {
    var newDob;
    $.ajax({
        url: '@(Url.Action("PatientDob"))?patientId=' + patient.val(),
        type: "GET",
        success: function (result) {
            // Displays correct result
            alert(result);
            newDob = result;
        },
        error: function (xhr, status, err) {
            alert(err);
        }
    });
    // Causes the box to become blank, HTML value attribute doesn't change
    $("#DoB").val(newDob);
});

Controller:

[HttpGet]
public string PatientDob(int patientId)
{
    return db.Patients.Find(patientId).DateOfBirth.ToString("MM/dd/yyyy");
}

Answer 1

Try to keep $("#DoB").val(result); inside the success function and see if it works.

Note: $("#DoB").val(newDob); is modified as $("#DoB").val(result);