的Javascript等待的extern Ajax請求

我做了基於primefaces DataTable中的一個簡單的滾動內容加載功能：的Javascript等待的extern Ajax請求

PF('tableWidget').jq.bind("scrollstop", function() { 
    var t = PF('tableWidget'); 
    if(t.jq.scrollTop() + t.jq.height() >= t.jq.children().height()) { 
     var rows = t.jq.find('tr');      //save current rows 
     $.ajaxSetup({async: false});      //ajax set sync 
     t.paginator.setPage(t.paginator.cfg.page + 1); //framework pagination function with an ajax call inside (and other stuff) to get new rows 
     rows.prependTo(t.jq.find('tbody'));    //AFTER pagination, add old rows 
     $.ajaxSetup({async: true});      //ajax set async again 
    } 
});

說明：當用戶向下滾動到DataTable的底部，我只是使用分頁，但之前保存舊的行。完成分頁後，我再次添加行。這留下了一個超酷的基於滾動的加載，其中只有新數據需要從服務器加載，而不是再次加載舊內容。

但正如我在其他問題中讀到的，使用同步ajax調用是不好的做法。

這並不容易覆蓋「t.paginator.setPage（X）」功能，因爲這個功能有任何地方Ajax調用。

有沒有一種方法，來包裝整體功能，並添加了一些成功的回調到它，而挖下來到真正的基本Ajax調用？

非常感謝！

來源

2017-02-16 kaiser

您可以setPage返回$就承諾，你的承諾回調的需要。

t.paginator.setPage = function(pageNum){ 
    // return the promise 
    return $.ajax(....); 
};

然後當你調用它：

t.paginator.setPage(t.paginator.cfg.page + 1).then(function(){ 
    rows.prependTo(t.jq.find('tbody')); 
});

來源

2017-02-16 15:35:53 charlietfl

感謝您的回答，但您在此重寫setPage函數。它已經在一個有很多不同函數調用的框架中實現，其中一個調用是ajax調用。有沒有辦法包裝setPage函數並獲得ajax調用事件？讓我們說一些綁定，或其他任何東西。 – kaiser

不，不是真的......這就是異步編碼的本質。你可以嘗試使用一個全球性的方法，比如'$（文件）.ajaxSuccess（）'和檢查所使用的網址或其他一些設置，將表明它是尋呼機相關 – charlietfl

，謝謝，我已經嘗試過的ajaxSuccess綁定到分頁程序的數據表（父），但事件沒有被解僱。 – kaiser

這裏是我的解決方案：因爲我需要去訪問分頁程序的onSuccess或的onComplete方法我現在用的DataTable primefaces給定AJAX監聽器。基於滾動的內容加載系統的整個代碼如下所示：

<p:dataTable id="table" value="#{items}" var="item" paginator="true" widgetVar="tableWidget"> 
    <p:ajax event="page" onstart="storeRows()" oncomplete="restoreRows()"/> 
    ... 
</p:dataTable> 

<h:outputScript> 
    <!-- variables --> 
    var rows; 

    <!-- scroll bottom to load more --> 
    PF('tableWidget').jq.bind("scrollstop", function() { 
     var t = PF('tableWidget'); 
     if(t.jq.scrollTop() + t.jq.height() >= t.jq.children().height()) { 
      t.paginator.setPage(t.paginator.cfg.page + 1); 
     } 
    }); 

    <!-- store and restore rows --> 
    function storeRows() { 
     var t = PF('tableWidget'); 
     rows = t.jq.find('tr'); 
    } 

    function restoreRows() { 
     var t = PF('tableWidget'); 
     rows.prependTo(t.jq.find('tbody')); 
    } 
</h:outputScript>

來源

2017-02-16 17:07:18 kaiser

的Javascript等待的extern Ajax請求

回答

相關問題