動態添加項目到UI：重複

我正在移動頁面上，並有一個列表約300項。用戶訪問該頁面時總共有300kb的數據。我實現了一個jQuery的列表視圖作爲複合材料部件的動態顯示與顯示功能更加列表視圖和任何內容：動態添加項目到UI：重複

<cc:interface> 
    <cc:attribute name="items" /> 
</cc:interface> 

<cc:implementation> 
     <form class="ui-filterable"> 
      <input id="filterable-input" data-type="search" placeholder="Search track..." />     
     </form> 
     <ul id="list" data-role="listview" data-filter="true" data-inset="true" data-input="#filterable-input"> 
      <ui:repeat id="repeater" value="#{cc.attrs.items}" var="item"> 
       <li style="padding: 0 10px"> 
        <cc:insertChildren/> 
       </li> 
      </ui:repeat> 
     </ul> 
     <input type="button" value="Show more" /> 
</cc:implementation>

我想要做什麼，減少第一渲染，讓我們對50項說。如果用戶再點擊顯示，那麼接下來的50個元素應該從服務器獲取並渲染，而不用再次加載舊元素。

沒有爲一個jquery的無界滾動例如： Jquery infinit scrool

但是他們僅使用常量表達式用於添加元素。在我的情況下，我想添加cc：insertChildren，其中的內容並不重要，可以動態選擇。

在我的Bean我有一個所有元素的列表。另一個想法是，使用ui的size屬性：repeat。但要改變這一點，我必須更新我的ui：repeat組件，並重新下載所有元素。因此，容易的數學總下載大小將爲我的例子50kb + 100 kb + 150kb + 200kb + ...

最後，我想有一個解決方案，在所有滾動從服務器的總下載大小是相等的到所有項目都在開始渲染時的大小。

來源

2017-01-26 kaiser

我已經做了一個非常簡單的解決方案，基於滾動的加載。儘管仍然存在一些小問題（不是真正的問題，而是棘手的黑客攻擊），但我想爲其他人提供這個解決方案。

Javascript wait for extern ajax request

我使用primefaces DataTable，並濫用內置的分頁:)

來源

2017-02-16 15:21:52 kaiser

動態添加項目到UI：重複

回答

相關問題