Pagination in Tab Content of Jquery UI

Posted by DR.GEWA on Stack Overflow See other posts from Stack Overflow or by DR.GEWA
Published on 2009-12-30T17:37:08Z Indexed on 2010/05/17 0:20 UTC
Read the original article Hit count: 760

Filed under:
|
|

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

© Stack Overflow or respective owner

Related posts about jquery-ui

Related posts about jQuery