Note that there are some explanatory texts on larger screens.

plurals
  1. POTapestry 5.4 call jquery more than once
    primarykey
    data
    text
    <p>I am trying to integrate <a href="http://getbootstrap.com/2.3.2/javascript.html#popovers" rel="nofollow">Bootstrap popover</a> to my Tapestry 5.4-alpha-14 application. I am new to Tapestry, and I am not sure how to use javascript there. </p> <p>My problem is that I want to show Bootstrap popover on each element in a zone loop when the zone is refreshed. First I have no elements in the zone, then the user submits a form and an element is loaded, and then some more user interaction, and another element is loaded, and so on... I want to show the popover on each loaded element in the loop. With the code bellow I was able to show the popover only when the first element was loaded, but then when the second is loaded the popover was lost. I also notice that the .js code was not called on the second load.</p> <p>Part of the .tml code:</p> <pre><code>&lt;t:zone t:id="selectedPagesZone" id="selectedPagesZone"&gt; &lt;div class="well" t:type="Loop" t:id="selectedLoop" t:source="selectedPages" t:value="item"&gt; &lt;div class="pop" data-toggle="popover" rel="popover" data-placement="top" data-container="body" data-content="Content" title="Title"&gt; ... &lt;/div&gt; &lt;/div&gt; &lt;/t:zone&gt; </code></pre> <p>Part of the .java code:</p> <pre><code>void onSuccess() { ... ajaxResponseRenderer.addRender(selectedPagesZone).ajaxResponseRenderer.addCallback(new JavaScriptCallback() { public void run(JavaScriptSupport javaScriptSupport) { javaScriptSupport.require("popover"); } }); </code></pre> <p>The popover.js code:</p> <pre><code>(function ($) { options = { placement:'right', trigger: 'hover', container: 'body', html: true } $('.pop').popover(options); $('.pop').popover('show'); })(window.jQuery); </code></pre> <p>I would appreciate any help you can give me.</p>
    singulars
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload