Динамический контейнер pjax

Вопросы по вёрстке и JavaScript
Ответить
ckv
Сообщения: 4
Зарегистрирован: 2016.12.06, 16:04

Динамический контейнер pjax

Сообщение ckv » 2016.12.06, 16:11

Мне необходимо получать контейнер для обновления библиотекой pjax с сервера, можно из заголовков, но как заставить саму библиотеку проглотить эти данные, кто-нибудь сталкивался, решал? Весь интернет прочел, все события и колбеки перепробовал - ноль результатов.

ckv
Сообщения: 4
Зарегистрирован: 2016.12.06, 16:04

Re: Динамический контейнер pjax

Сообщение ckv » 2016.12.06, 16:50

Грубо говоря, я хочу что-то типа:

Код: Выделить всё

    $(document).on('submit', 'form', function (event) {
        $.pjax.submit(event, {
            success: function(qXHR) {
                var container = qXHR.getResponseHeader('X-PJAX-CONTAINER');
                $(container).html(qXHR.responseText);
            }
        });
});
 

andrei.obuhovski
Сообщения: 610
Зарегистрирован: 2015.07.16, 10:50

Re: Динамический контейнер pjax

Сообщение andrei.obuhovski » 2016.12.07, 06:38

Не понятно зачем вам pjax нужен. На jquery это решается как-то так:

Код: Выделить всё

$.get('/url', (data, status, res) => {
    const containerId = res.getResponseHeader('X-PJAX-CONTAINER');
    const $containerFromServer = $(data).find('#'+containerId);
    $('#'+containerId).html($containerFromServer.html());
})

ckv
Сообщения: 4
Зарегистрирован: 2016.12.06, 16:04

Re: Динамический контейнер pjax

Сообщение ckv » 2016.12.07, 11:40

Очевидно, мне нужен pjax ради тех функций, которые он дает поверх стандартного jquery, конкретно в данном примере нет поддержки pushState и плюшек типа обновления заголовков из коробки. Конечно, это всё можно реализовать самому, но зачем, если есть уже продуманный способ, о котором я просто могу не знать.

Loveorigami
Сообщения: 974
Зарегистрирован: 2014.08.27, 21:54

Re: Динамический контейнер pjax

Сообщение Loveorigami » 2016.12.07, 16:42

Добавьте на кнопку data-pjax-container = "my-div", после submit-a ловите через var container = $(this).data("my-div") и обновляйте container.

ckv
Сообщения: 4
Зарегистрирован: 2016.12.06, 16:04

Re: Динамический контейнер pjax

Сообщение ckv » 2016.12.07, 17:01

Loveorigami писал(а):Добавьте на кнопку data-pjax-container = "my-div", после submit-a ловите через var container = $(this).data("my-div") и обновляйте container.
Мне именно это и нужно, после отправки формы я получаю html с сервера и в нем в принципе могу указать data-pjax-container, вопрос - в каком событии pjax и каким образом подменить контейнер, ведь он обязывает указывать его ДО отправки формы. Пробовал в pjax:end, pjax:beforeReplace, pjax:success, но ничего не вышло, вот я и подумал, что, возможно, у кого-то здесь возникала такая же проблема и он её, быть может, легко решил. Спасибо.

Loveorigami
Сообщения: 974
Зарегистрирован: 2014.08.27, 21:54

Re: Динамический контейнер pjax

Сообщение Loveorigami » 2016.12.07, 21:22

Не в нем, а на кнопке, по клику на которой вы получите контейнер, в который и выгрузите html.
Примерно так.

Код: Выделить всё

<div id="my-div"></div>
<form>
............
<button type="submit" data-pjax-container = "#my-div">
</form>

<script>
$(document).on('submit', 'form', function (event) {
        $.pjax.submit(event, {
            success: function(data) {
                var container = $(this).data("pjax-container");
                $(container).html(data);
            }
        });
</script>

Ответить