views:

12

answers:

0

I have several views (block displays) on my site and I've noticed that the ones without exposed filters have working ajax pagers. For some reason the views with exposed filters seem to keep the ajax pager from working for that view. The option is set to "yes" in the view so it's not just a simple oversight.

My question would be: Does ajax not work with block displays with exposed filters?

I had to manually setup some jquery functions to force the exposed filters form to submit via ajax but I can't figure out what needs to happen for the pager to work the same way. The exposed form was easy since when you submit it shows the args you need to send to the view with $.get() in the url. But the pager args are in the code of the pager itself: /page-name?page=0,1

But when I try to do the same thing for it, the page still refreshes instead of doing an ajax update. I'm assuming to make it work I'd have to send all of the info I'd send for the exposed filter submit plus the page argument.

In any case it doesn't seem to work when I try it.

I've been trying this code:

$('#block-views-Tutorials-skill_search .item-list ul.pager li.pager-next a').click(function(){
    $(this).append('<span class="views-throbbing">&nbsp;</span>');
    var args = $(this).attr('href');
    numchars = args.length-17;
    args = args.substr(17,numchars);
    var text = $('input[name=text]');
    var kp = $('input[name=kp]');
    var term = $('input[name=term]');
    var num = $('select[name=items_per_page]');
    $.get('/views/ajax/?text='+text.val()+'&kp='+kp.val()+'&term='+term.val()+'&items_per_page='+num.val()+'&'+args+'&view_name=Tutorials&view_display_id=skill_search&view_args=&view_path=node%2F2&view_base_path=driveway-skills%2Fsearch&view_dom_id=2&pager_element=1', null, skillDetails);
    return false;
});

For convenience, here's the skillDetails code too:

    var skillDetails = function(response) {
    var result = Drupal.parseJson(response);
    $('#block-views-Tutorials-skill_search .view').html(result.display);
    $('#block-views-Tutorials-skill_search .view .form-submit').addClass('ui-corner-all ui-button ui-state-default ui-widget');
    $('#block-views-Tutorials-skill_search .view .form-submit').hover(function(){ $(this).addClass('ui-state-hover'); },function(){ $(this).removeClass('ui-state-hover'); });
    $('#views-exposed-form-Tutorials-skill-search').attr('action','/driveway-skills');
    $('#views-exposed-form-Tutorials-skill-search #edit-submit-Tutorials').click(function(){
        $('#views-exposed-form-Tutorials-skill-search .views-exposed-widget:last-child').append('<span class="views-throbbing">&nbsp;</span>');
        var text = $('input[name=text]');
        var kp = $('input[name=kp]');
        var term = $('input[name=term]');
        var num = $('select[name=items_per_page]');
        if(typeof _trackPageview == "function"){
            if(text.val() != '') _trackPageview('/search-keyword/'+text.val());
            if(kp.val() != '') _trackPageview('/search-tutorial-kepoint/'+kp.val());
            if(term.val() != '') _trackPageview('/search-glossary-term/'+term.val());
        }
        $.get('/views/ajax/?text='+text.val()+'&kp='+kp.val()+'&term='+term.val()+'&items_per_page='+num.val()+'&view_name=Tutorials&view_display_id=skill_search&view_args=&view_path=node%2F2&view_base_path=driveway-skills%2Fsearch&view_dom_id=2&pager_element=1', null, skillDetails);
        return false;
    });
}

I use the same skillDetails function for when the Apply button is clicked in the exposed form and it works fine there.

So any clues as to what is going on here? Am I trying to reinvent the wheel or is there no other way to make this work?

Thanks in advance for any help/suggestions.

update

I noticed some problems with my click code and fixed them. That got the ajax refresh to work for the pager now but doesn't answer the question of whether or not there is a better way to do this. One would expect the ajax option in views to manage all of that itself.

Also, this creates a new annoying side issue: in IE I get a js error when clicking on the pager links.

"Expected ';'" It says it needs it on line 181,498,705. Which is insane considering that even when all of the results of the views blocks on the page the lines would not reach anywhere near that. Looking through my code I don't see a missing semicolon. Any idea why IE would be acting stupid on that? Other than "because it's IE"? ;)