Question

我有一个搜索结果屏幕，其中我显示了许多行，然后使用jPages plugin以非常简单的方式对其进行分页。这非常有效。执行此操作的代码位于

之下

  <script type="text/javascript">
        function paginate() {
            $('div.holder').jPages({
                containerID: 'searchResults',
                perPage: 5
            });
        }

        $(function(){
            paginate();
        });
  </script>

关于jPage插件的快速入门 - 我有一个表格，其中正文具有标识符＆＃39; searchResults＆＃39;然后我在桌子的底部有一个名为＆＃39; holder＆＃39;的div。 jQuery插件会自动遍历所有元素并创建页面，并将实际分页放置在＆＃39; holder中。 div元素。

现在，当用户单击屏幕上的特定复选框时，将进行AJAX调用以刷新搜索结果，并使用该AJAX调用的内容重新填充表。这也很好 - 下面的代码 -

$(function() {
    $('.dark-checkbox').click(function(e) {
        var data = $('#search-form').serialize();
        refreshSearchResults(data);

        paginate();
        e.preventDefault();
        e.stopPropagation();
    });     
});

function refreshSearchResults(data) {
    if (data.length==0) { 
        return;
    }

    if (window.XMLHttpRequest) {
        // code for IE7+, Firefox, Chrome, Opera, Safari
        xmlhttp=new XMLHttpRequest();
    } else {  // code for IE6, IE5
        xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
    }

    xmlhttp.onreadystatechange=function() {
        if (xmlhttp.readyState==4 && xmlhttp.status==200) {
            document.getElementById("search-results").innerHTML=xmlhttp.responseText;
        }
    };

    xmlhttp.open("GET","candidate_search_results.php?"+data,true);
        xmlhttp.send();
}

正如您所看到的，我已尝试根据搜索结果刷新重新生成分页，作为点击处理程序中的最后一步。

分页重新生成，但就像一页一样 - 换句话说，插件似乎并没有真正正常工作并创建正确的分页流程。我试过把电话转移到＆＃39; repaginate＆＃39;在代码的其他部分，它似乎也没有工作。任何人都可以帮我弄清楚我做错了什么吗？提前谢谢你......

Answer 1

解决了它 - 用真正的jQuery AJAX代码替换了非jQuery AJAX方法。基本上，我用下面的代码替换了refreshSearchResults（）方法 - 这就是诀窍

$(function(){
    $('#search-form').find('.dark-checkbox').click(function(){
        alert($('#search-form').serialize());
        $.ajax({
            type:'GET',
            url:$('#search-form').attr('action'),
            data:$('#search-form').serialize(),
            success:function(response){
                $('#search-results').html(response);
                paginate();
            }
        });
    });
});

AJAX调用后jQuery分页不会重新绑定

1 个答案: