Очередность действий внутри ajax - есть ответ

Без имени, 183 просмотра

-2

Использую ajax запрос, для вытягивания данных из БД в формате JSON

Внутри success должно происходить следующее:
1. Очищаем div
2. Создаем шапку таблицы
3. Получаем данные из базы
4. Закрываем таблицу

success: function (data) {
$("#addInfo_area").empty();
$("#addInfo_area").html("<table class='table table-hover'>" +
"<thead><tr>" +
"<th>id</th>" +
"<th>name</th>" +
"</tr></thead><tbody>");
for (var i = 0; i <data.length; i++) {
$("#addInfo_area").append("<tr>" +
"<td>"+data[i].id+"</td>" +
"<td>"+data[i].name+"</td>" +
"</tr>");
}
$("#addInfo_area").append("</tbody></table>");
}

В итоге у меня сначала создается и закрывается таблица, а только потом приходят данные из БД.
Я так понимаю, запрос в базу задерживается и поэтому такая ерунда получается.

Подскажите, как лучше поступить, что использовать,..вобщем наведите на правильный путь

Примечание:
уже пробовал async: false, к сожалению, это ничего не меняет

Ответы:

CKB

допишите там такую штуку
async: false

slo_nik

сначала формируете строки и ячейки таблицы, заполняете их данными, а потом уже создаёте саму таблицу и вставляете данные.
и не напрямую делаете через html(), а создаёте переменную, куда запишите таблицу с данными и только после этого воспользуетесь $("#addInfo_area").html(table)

mr.Strike

слоник говорит правильно.
Но я бы сформировал на сервер php скриптом таблицу и передал уже как готовый html код и просто
$("#addInfo_area").html(data.html);

OverHerz

success: function (data) {
$("#addInfo_area").empty();
$("#addInfo_area").html("<table class='table table-hover'>" +
"<thead><tr>" +
"<th>id</th>" +
"<th>name</th>" +
"</tr></thead><tbody></tbody></table>");
var table = $("#addInfo_area table");
for (var i = 0; i <data.length; i++) {
table.append("<tr>" +
"<td>"+data[i].id+"</td>" +
"<td>"+data[i].name+"</td>" +
"</tr>");
}
}

11 лет назад

RPI.su - самая большая русскоязычная база вопросов и ответов. Наш проект был реализован как продолжение популярного сервиса otvety.google.ru, который был закрыт и удален 30 апреля 2015 года. Мы решили воскресить полезный сервис Ответы Гугл, чтобы любой человек смог публично узнать ответ на свой вопрос у интернет сообщества.

Все вопросы, добавленные на сайт ответов Google, мы скопировали и сохранили здесь. Имена старых пользователей также отображены в том виде, в котором они существовали ранее. Только нужно заново пройти регистрацию, чтобы иметь возможность задавать вопросы, или отвечать другим.

Чтобы связаться с нами по любому вопросу О САЙТЕ (реклама, сотрудничество, отзыв о сервисе), пишите на почту [email protected]. Только все общие вопросы размещайте на сайте, на них ответ по почте не предоставляется.