PJAX после рендеринга шаблона AJAX

У меня есть приложение, которое использует jQuery и pjax (автономно). Мы пытаемся поэкспериментировать, чтобы увидеть, можем ли мы использовать, возможно, более гибкий и меньший npm pjax вместо jquery-pjax.

Одна из моих функций устанавливает HTML-код div после загрузки данных, и этот HTML-код включает ссылки, которые мы хотим использовать в качестве ссылок pjax, например $('#link-container').html('<a href="/account_detail.html?='+account.id+'" data-pjax >'). Однако нажатие на эту ссылку вызывает полную перезагрузку страницы, а не запрос pjax.

Есть ли способ переопределить pjax? Когда я пытаюсь new PJAX({elements:[a[data-pjax]]}) внутри вызова pjax:success (когда DOMReady со страницы проекта - https://www.npmjs.org/package/pjax), он использует pjax... но затем дважды загружает ресурсы.

Возможно, лучшее решение будет с jquery-pjax ($(document).pjax(a[data-pjax] и т. д.), но я хотел узнать, сталкивался ли кто-нибудь с проблемой такого типа раньше. Возможно, jQuery редко включается и не-jQuery pjax, но похоже, что это может произойти для любого асинхронного запроса данных и модификации DOM, и я просто хочу повторно PJAX.


javascript html jquery ajax pjax
person arilaan    schedule 30.09.2014    source источник

Ответы (1)


arrow_upward
1
arrow_downward

Я использую jquery-pjax, и когда вы его используете или настраиваете неправильно, он также обновляет страницу, поэтому вы столкнулись с одной из проблем, с которыми я столкнулся.

В любом случае, я не уверен, поможет ли это вашей проблеме или нет, но я предлагаю всем использовать Firefox с Firebug и на вкладке «Консоль» нажать «Сохранить», вы обычно найдете там некоторые ошибки, которые могут быть полезны. , и поскольку ошибки где-то могут привести к обновлению страницы - иногда вы пропустите это, так как консоль тоже обновляется.

Я узнал, что вам нужно убедиться, что когда вы пишете:

<a href="/account_detail.html?=2" data-pjax>bla</a>

Вам нужен контейнер, в который PJAX помещает содержимое, например:

<div id="pjax-container"></div>

И изначально вы настраиваете PJAX для привязки этих объектов:

<script>
  // this is how I define it in jquery-pjax, so adjust it as you use it.
  $(document).pjax('a[data-pjax]', '#pjax-container');
</script>

поэтому ключевые моменты, которые я узнал, вызывают обновление с помощью PJAX:

  • Я отправляю заголовок дважды (внутренний код)
  • Контейнер был внезапно удален из тела HTML ( div id="pjax-container" ), и когда DOM отсутствует, у него нет места для удаления HTML, поэтому он просто обновляет страницу.
  • Когда я изначально привязываю a[data-pjax] к jQuery, новый объект DOM не повторно привязывается jQuery автоматически (если только не используется «live/on»), поэтому они действуют как обычный тег <a> и перезагружают страницу с новым URL.
  • некоторая синтаксическая ошибка JS/PJAX

В вашем случае, если pjax-контейнер "#link-container", я не уверен, что это хорошая идея - размещать теги внутри него.

person Ricky Levi    schedule 27.02.2015