#javascript #asynchronous #modal-dialog #popup #ecmascript-5
#javascript #асинхронный #модальный-диалог #всплывающее окно #ecmascript-5
Вопрос:
У меня есть бизнес-требование показывать ожидающий модальный режим перед вызовом синхронного вызова веб-API.
Я использую очень старый код (до 2011 года, если я не ошибаюсь), и, боюсь, у меня возникли проблемы с пониманием, почему он не работает. Мы не используем ES6 Это код для отображения модального:
showWaitingMessage: function (isShow, title, message) {
if (isShow) {
var left = (window.top.$(document.body).width() / 2) - 150 "px";
div = $("<div></div>");
div.attr("id", "messageDiv");
div.attr("align", "center");
div.css("width", "300px");
div.css("border", "1px solid #000000");
div.css("background", "#F7F3F7");
div.css("z-index", "2000");
div.css("position", "absolute");
div.css("left", left);
var html = "";
if (title != undefined amp;amp; title != null amp;amp; title != "")
html = "<div style='font-family:Tahoma,Arial;font-size:14px;font-weight:bold;padding:10px 10px 0px 10px'>" title "</div>";
html = "<div style='padding:10px 0px 10px 0px;'><img alt='' src='/_imgs/AdvFind/progress.gif'/></div>";
if (message != undefined amp;amp; message != null amp;amp; message != "")
html = "<div style='font-family:Tahoma,Arial;font-size:12px;padding:0px 10px 10px 10px'>" message "</div>";
div.html(html);
var top = (window.top.$(document.body).height() / 2) - (div.height() / 2);
div.css({ "top": top });
Elad.Global.greyout(true);
window.top.document.body.appendChild(div[0]);
}
else {
var div = window.top.$("#messageDiv");
if (div.length > 0)
div.remove();
Elad.Global.greyout(false);
}
},
Вот где я пытаюсь выполнить указанную выше функцию:
function createReminder() {
if (shouldCreateReminder()) {
Elad.Global.showWaitingMessage(true, "אנא המתן...", "אנא המתן ליצירת פעילות המשך עוקבת");
// logic
var result = Elad.Global.callWebApi("POST", url, request, null, createReminderErrorCallback);
Elad.Global.showWaitingMessage(false);
if (result amp;amp; result.Success) {
// logic
}
}
}
}
Странно то, что запуск второй части асинхронным способом, похоже, приводит к появлению модального, поэтому я озадачен тем, что здесь происходит.
Спасибо!
Комментарии:
1. покажите модальный, затем выполните вызов синхронизации за установочным временем 1 мс, давая время dom для отображения модального, прежде чем блокировать дальнейший рендеринг в ожидании завершения вызова.
2. Спасибо! сработало как по волшебству! Итак, что же произошло, так это то, что DOM ожидает завершения выполнения синхронного кода и только после этого обновляет DOM? применимо ли это ко всем JS? обновления dom «ожидаются» для завершения выполнения кода?