JQuery не работает изнутри функции

Поэтому у меня есть следующая функция:

$('#calendar_appointment_technician_id').change(function(){
 var technician = $('#calendar_appointment_technician_id').val();
 var date = $('#date').val();
 var id = $('#calendar_appointment_id').data("id");
 var response = $.get("/update_appointment_times?technician="+technician+"&date="+date+"&id="+id);
 $('#appointment_times').html(response.responseText);
 });

Который получает запрос получения при изменении раскрывающегося списка. Это связано с тем, что время встречи изменится, если вы измените своего техника. Этот код дает следующий ответ:

Object {readyState: 1, getResponseHeader: function, getAllResponseHeaders: function, setRequestHeader: function, overrideMimeType: function…}

И самое главное, никакого текста ответа. Теперь запустите этот код в инструментах chrome dev на странице:

var technician = $('#calendar_appointment_technician_id').val();
 var date = $('#date').val();
 var id = $('#calendar_appointment_id').data("id");
 var response = $.get("/update_appointment_times?technician="+technician+"&date="+date+"&id="+id);
 $('#appointment_times').html(response.responseText);

Этот код дает мне ответный текст, и ответ выглядит так:

Object {readyState: 4, getResponseHeader: function, getAllResponseHeaders: function, setRequestHeader: function, overrideMimeType: function…}

Почему это отлично работает за пределами функции, но изнутри get даже не выглядит должным образом срабатывающим?

1 ответ

.get() jQuery .get() является асинхронным, поэтому вам нужно убедиться, что он был выполнен, прежде чем пытаться использовать возвращаемые данные.

$.get() возвращает интерфейс jQuery.promise который мы можем использовать для обнаружения, когда запрос на получение завершен.

var response = $.get("/update_appointment_times?technician=" + technician + "&date=" + date + "&id=" + id);

response.then(function (response) {
 $('#appointment_times').html(response)
});

licensed under cc by-sa 3.0 with attribution.