Python, JSON, AJAX, JQuery + Jinja

233
06 мая 2017, 21:44

Имеется сайт, в котором я использую AJAX (через XHR запрос, XMLHttpRequest). Сервер на пайтоне, на сервере (Python+Flask) генерится выборка из SQLной базы и возвращает через JSON дамп массив с энным количеством объектов внутри (return json.dumps(hystorytable) ), ответ сервера:

[{"comment": "", "descr": "Salary", "p_id": 82, "quantity": 1, "summ": 21, "totalsum": null, "tranfere_date": "2017-05-04 17:58:34", "user_id": 3}, {"comment": "", "descr": "Salary", "p_id": 81, "quantity": 1, "summ": 2, "totalsum": null, "tranfere_date": "2017-05-04 17:57:41", "user_id": 3}]

Я хочу заменить свою табличку, которая ранее была сгенерена в HTML с помощью цикла Jinja на новую табличку, также сгенеренную с помощью Jinja цикла, но, видимо, Jinja не понимает отпарсенные данные (для генерации начальной таблицы используется return render_template ("index.html", hystorytable=hystorytable)).

JS-код такой:

var response = JSON.parse(aj.responseText);
$('#history_table').html('');
var insert_table='<table class="table table-striped"><thead><tr><th>Summ</th><th>Description</th><th>Comment</th><th>Date and time</th></tr></thead><tbody>{% for stock in response %}<tr align="center" ><td>{{stock.summ | usd}}</td><td>{{stock.descr}}</td><td>{{stock.comment}}</td><td>{{stock.tranfere_date  }}</td></tr>{% endfor %}</tbody></table>';
$('#history_table').html(insert_table);

Цикл Jinja, который генерит первоначальную таблицу (которую я хочу заменить сгенерированной новой таблицей), такой:

<table class="table table-striped">
    <thead>
        <tr>
            <th>Summ</th>
            <th>Description</th>
            <th>Comment</th>
            <th>Date and time</th>
        </tr>
    </thead>
    <tbody>
        {% for stock in hystorytable %}
            <tr align="center" >
              <td>{{stock.summ | usd}}</td><td>{{stock.descr}}</td><td>{{stock.comment}}</td><td>{{stock.tranfere_date  }}</td>
            </tr>
        {% endfor %}
     </tbody>
</table> 

Я сравниваю текст ответа, полученного при генерации страницы render_template ("index.html", hystorytable=hystorytable) - смотрю, что из себя представляет hystorytable в питоне - print (hystorytable) с ответом, который получаю через return json.dumps(hystorytable)` (смотрю в JS в responseText) и вижу, что текст одинаковый, но результат получаю разный.

Помогите, пожалуйста, построить новую таблицу...

Answer 1

Огромнейшее спасибо gil9red за подсказку с полем поисков.

Решение

1) Создать в папке template файл table_operations.html

<div name="history_table" id="history_table">
    <table class="table table-striped">
        <thead>
            <tr>
                <th>Summ</th>
                <th>Description</th>
                <th>Comment</th>
                <th>Date and time</th>
            </tr>
        </thead>
        <tbody>
            {% for stock in hystorytable %}
                <tr align="center" >
                  <td>{{stock.summ | usd}}</td><td>{{stock.descr}}</td><td>{{stock.comment}}</td><td>{{stock.tranfere_date  }}</td>
                </tr>
            {% endfor %}
         </tbody>
    </table>
</div>

2) в питоне исправить код возврата:

return render_template ("table_operations.html", hystorytable=hystorytable)

3) в JavaScript внести исправления:

   $('#history_table').html(aj.responseText);

где history_table - это id моего дива, в котором находится таблица:

<div name="history_table" id="history_table">
...
</div>
READ ALSO
Скорость выполнения на jquery или js?

Скорость выполнения на jquery или js?

На чём быстрее будет скорость выполнения на чистом js или jquery в этом примере?

239
Ползунок прогресс-бара настройка

Ползунок прогресс-бара настройка

Как реализовать увеличение позиции ползунка на 20% от левого края каждый раз при нажатии кнопки "Далее", при условии, что выбран ответ?

228
анимация не срабатывает в safari при возврате на странице при нажитии назад в браузере

анимация не срабатывает в safari при возврате на странице при нажитии назад в браузере

столкнулся с проблемой что анимация не срабатывает на главной странице если мы возвращаемся с внутриней странице (нажали кнопку назад в браузере),...

244
Нужно изменить стили, прописанные в navbar.less

Нужно изменить стили, прописанные в navbar.less

Написал html, css и jsВерстка работает, как было сказано заказчиком

339