Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Dom Css lost after jQuery Pagination Wordpress widget

I have developed a widget for Wordpress to show portfolio, the user can choose if he wants pagination, filter categories, the number of post per page...and so on, it works all perfectly with a php pagination system i have made.

I am trying to implement an ajax jquery to this pagination in widget to make it reload without reloading the whole page. I have this code:

jQuery('.paginate a').live('click', function(e){ 
e.preventDefault(); 

var link = jQuery(this).attr('href');  
jQuery('.widget_gantry_portfolio').html('<div class="loading"></div>');
jQuery('.widget_gantry_portfolio').load(link+' .widget_gantry_portfolio .portfolio_class');

The pagination works perfectly in php, when I implement this code the pagination works but when clicked the widget losses all the user preferences(show filter, show pagination..etc), the divs also loose their calculated % width and height that was firstly present in css(seen in firebug):

element.style{width and height}

I have been several days around this and have prove instead of live, on and delegate, and so on, but none of them work, this ajax pagination is working also perfectly in posts pagination on my site but the widget does´nt reload Dom elements?

The most important thing for me are:

-Each of the elements missing width and height, that was in DOM css, firstly this width is calculated with a functions.php enqued script that goes like this for example when it has 4 columns:

var mysizes = function() {
    theWidth4 = jQuery(".mosaic-block4c img").css('width');
    jQuery(".mosaic-block4c").css('width', theWidth4);
    theHeight4 = jQuery(".mosaic-block4c img").css('height');
    jQuery(".mosaic-block4c").css('height', theHeight4);
}

I call the mysizes(); function from the widget php with a tag

-The filter of categories missing i think because, when pagination load, doesn't recognizes the user presets for widget.It recognizes it perfectly in first page but no in subsequent pages.

Link to the site with portfolio widget pagination not working properly (please click 2 page to see):

http://framecero.com/aagantrywordpress/?page_id=635

Link to a sample category with this same pagination working (pagination at the bottom of page):

http://framecero.com/aagantrywordpress/?cat=4

like image 557
Jose Lo Avatar asked Jun 14 '12 16:06

Jose Lo


1 Answers

From Jure C. comment:

A quick look shows that you're at least changing HTML structure. On paginated page you have .portfolio_class twice nested while original is only once.

like image 174
2 revs Avatar answered Nov 15 '22 05:11

2 revs