I am making a page with Jquery UI TABS.
In one of tabs I want to make pagination for comments.
I want such thing. When user clicks on the number of the page,
the data of the page , which is linked will load via ajax in the tab.
Here is my code
<script type="text/javascript">
$(function() {
$("#tabs").tabs();
});
$('#demo').tabs({
load: function(event, ui) {
$('a', ui.panel).click(function() {
$(ui.panel).load(this.href);
return false;
});
}
});
</script>
How can I change this , so that any
link inside the content with lets say with id "pagination"
<a href="/coments?page=12&user_id=12" id="pagination">12</a>
??
Thanks beforehand
I tried recently like this even and no luck.
This is from http://www.bannerite.com/jquerytest/index2.php
Here it work
<script type="text/javascript">
$(function() {
$("#tabs").tabs();
var hijax = function(panel){
$('a', panel).click(function() {
/**makes children 'a' on panel load via ajax, hence hijax*/
$(panel).load(this.href, null, function(){
/**recursively apply the hijax to newly loaded panels*/
hijax(panel);
});
/**prevents propagation of click to document*/
return false;
});
$('form', panel).css({background: 'yellow'}).ajaxForm({
target: panel,
});
};
$('#demo ul').tabs({
/**initialize the tabs hijax pattern*/
load: function(tab, panel) {
hijax(panel);
}
});
});
</script>
HEre are the HTML part as Karl gived , but no succes. When clicking on Test
link its going to another page........
When clicking on
I wanted to post HTML here but because of users with less reputation <10 cant give HTML with links I have posted it here
http://gevork.ru/2009/12/31/jquery-ui-tab-and-pagination-html/#more-58
