При загрузке страницы делаю AJAX запрос в сторону сервера и получаю определённые данные. После получения этих данных, присваиваю их определенным классам.
$.ajax
({
url: "ajax_async/",
type: "POST",
data: $('#ajax_form').serialize(),
success: function(response)
{
var jsonResult = JSON.parse(response);
var ajax_text = "";
var ajax_date = "";
for (i = 0; i < 3; i++)
{
ajax_date += jsonResult[i].fields.pub_date;
ajax_text += jsonResult[i].fields.ajax_text;
}
$('#ajax_date').html(ajax_date);
$('#ajax_text').html(ajax_text);
},
error: function(response)
{
alert("Запрос в ajax_async не может быть обработан!");
}
});
На выходе получается что-то вроде этого:
<div id="ajax_list">
<div id="ajax_date">ДатаДатаДата</div><div id="ajax_text">ТекстТекстТекст</div>
</div>
,т.е. полученные значения идут сплошняком.
Ситуацию исправляет контрактация тега
br:
ajax_date += jsonResult[i].fields.pub_date + "<br>";
ajax_text += jsonResult[i].fields.ajax_text+ "<br>";
.
Является ли данный способ правильным?
Проблема еще усугубляется тем, что есть шаблонизатор, который принимает в себя словарь (подобие массива с ключём - значением), а после чего может выводить данные в примерно таком формате:
{% if ajax_list %}
{% for ajax in ajax_list %}
{{ ajax.pub_date }} {{ajax.ajax_text}} <br>
{% endfor %}
{% else %}
<p>На данный момент записей в БД нет.</p>
{% endif %}
, т.е. это работает непосредственно в HTML коде.
Сейчас мне мой способ кажется весьма громоздким и неправильным.
Я могу возвращать шаблон приведённые выше как результат AJAX-выполнения скрипта, однако тогда теряю в гибкости (например, выбрать определённый элемент в распаренном словаре).
В общем, ломаю голову, не пойму, в какую сторону копать.
Простой