Note that there are some explanatory texts on larger screens.

plurals
  1. POjquery - open links in the current tab instead of leaving the page
    text
    copied!<p>I'm very new to jquery and I need you help with the following:</p> <p>I have a file "mainPage.jsp" which contains jquery tab, with only one tab at the moment. the content of this tab is an included jsp file, users.jsp, which builds a table of users. each user row contains a "details" column which contains the following link:</p> <pre><code>&lt;a href="userDetails.jsp?userid=&lt;%=user.getUserID()%&gt;" style="color: blue;"&gt;Details&lt;/a&gt; </code></pre> <p>When a user clicks on this link I want the new content to be presented in the current tab, instead of changing the page (which is what it currently does).</p> <p>There is an explanation in the following link on how to do it , but i guess i'm doing something wrong:</p> <p><a href="http://jqueryui.com/demos/tabs/#...open_links_in_the_current_tab_instead_of_leaving_the_page" rel="nofollow">open links in the current tab instead of leaving the page</a></p> <p>my mainPage.jsp :</p> <p></p> <pre><code>&lt;div id="tabs"&gt; &lt;ul&gt; &lt;li&gt;&lt;a href="#tabs-1"&gt;Users&lt;/a&gt;&lt;/li&gt; &lt;/ul&gt; &lt;div id="tabs-1"&gt; &lt;jsp:include page="users.jsp" /&gt; &lt;/div&gt; &lt;/div&gt; </code></pre> <p></p> <p>The script in this page:</p> <pre><code>&lt;script type="text/javascript"&gt; $(document).ready(function() { $('#tabs').tabs(); $('#tabs').on('click', 'a', function(event) { $.get($(this).attr('href'), function (response){ $(this).parent().html(response); event.preventDefault(); }); }); }); &lt;/script&gt; </code></pre> <p>also tried:</p> <pre><code> &lt;script type="text/javascript"&gt; $(document).ready(function() { $('#tabs').tabs(); $('#tabs').on('click', 'a', function(event) { $(ui.panel).load(this.href); event.preventDefault(); }); }); &lt;/script&gt; </code></pre> <p>this is a link that appears (after running the jsp):</p> <pre><code>&lt;a href="userDetails.jsp?userid=14" style="color: blue;"&gt;Details&lt;/a&gt; </code></pre> <p>any ideas?</p> <p>Thanks!</p>
 

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