Гобелен 5.4 вызов jquery более одного раза

Question

Я пытаюсь интегрировать Bootstrap popover в свое приложение Tapestry 5.4-alpha-14. Я новичок в Tapestry, и я не уверен, как использовать там JavaScript.

Моя проблема заключается в том, что я хочу показать всплывающее окно Bootstrap для каждого элемента в цикле зоны при обновлении зоны. Сначала у меня нет элементов в зоне, затем пользователь отправляет форму, и элемент загружается, а затем еще какое-то взаимодействие с пользователем, загружается еще один элемент и т. Д. Я хочу показать всплывающее окно для каждого загруженного элемента. в петле. С помощью приведенного ниже кода я смог показать поповер только тогда, когда был загружен первый элемент, а затем, когда загружен второй элемент, поповер потерян. Я также заметил, что код.js не был вызван при второй загрузке.

Часть кода.tml:

<t:zone t:id="selectedPagesZone" id="selectedPagesZone">
 <div class="well" t:type="Loop" t:id="selectedLoop" t:source="selectedPages" t:value="item">
    <div class="pop" data-toggle="popover" rel="popover" data-placement="top"  data-container="body" data-content="Content" title="Title">
        ...
     </div>
   </div>
</t:zone>

Часть кода.java:

void onSuccess() {
...
ajaxResponseRenderer.addRender(selectedPagesZone).ajaxResponseRenderer.addCallback(new JavaScriptCallback() {
   public void run(JavaScriptSupport javaScriptSupport) {
      javaScriptSupport.require("popover");
    }
});

Код popover.js:

(function ($) {
options = {
    placement:'right',
    trigger: 'hover',
    container: 'body',
    html: true
  }
$('.pop').popover(options);
$('.pop').popover('show');
})(window.jQuery);

Буду признателен за любую помощь, которую вы можете мне дать.

Answer 1

require.js выполнит тело вашего js только один раз. Вы должны определить функцию, которая настраивается один раз, но выполняется несколько раз.

popover.js

define(["jquery"], function($) {
    var privateFunc = function(args) {
        options = {
            placement:'right',
            trigger: 'hover',
            container: 'body',
            html: true
        };
        $('.pop').popover(options);
        $('.pop').popover('show');
    };
    return { publicFunc: privateFunc};
});

код Java

ajaxResponseRenderer.addCallback(new JavaScriptCallback() {
    public void run(JavaScriptSupport javaScriptSupport) {
        JSONObject args = new JSONObject("foo", "bar");
        javaScriptSupport.require("popover").invoke("publicFunc").with(args);
    }
});

Смотрите здесь для получения дополнительной информации