SlickGrid AJAX數據

Question

我想讓AJAX與SlickGrid一起工作。 The example given is hardcoded for Digg。

另外，我不認爲緩存在這個例子中工作。由於Digg限速，很難真正瞭解它的工作原理。我如何設置SlickGrid從分頁中獲取數據庫中的數據。

Answer 1

1. 類添加到要使用Ajax
2. Add an onRenderCompleted event
3. 綁定使用類的選擇和添加的東西像其他DOM elementent onRenderCompleted函數內部

Answer 2

我剛去的列通過這個，所以這裏是我做的：

1. 複製實例的內容e6-ajax-loading.html（在SlickGrid下載中）放到你的html文件中 - 讓我們稱之爲mygrid.html（或者放到你的代碼中生成html。在我的情況下，我使用CodeIgniter，所以我複製到mygrid_view.php）。

2. 將slick.remotemodel.js複製到yourRemoteModel.js。

3. 在「mygrid.html」中，確保您具有所有javascript文件的正確路徑。將slick.remotemodel.js更改爲yourRemoteModel.js。消除任何重複的腳本 - 例如，如果您已經在使用最新版本的jQuery，則取消引入jquery-1.4.3.min.js的「mygrid.html」中的行。

4. 在「mygrid.html」中，更改'columns'變量的初始值以匹配要從數據庫中顯示的數據。注意字段屬性。這必須與將從服務器返回的JSON響應中的屬性名稱一致。 （*參見最後關於這個的註釋）。

5. 在yourRemoteModel.js中，將url變量更改爲指向您的服務器，並傳遞適當的參數。在我來說，我通過頁面和行paramters到我的服務器這樣的： 「？頁=」

   VAR URL = myServerUrl + + fromPage + 「&行=」 +（（（toPage - fromPage）* PAGESIZE）+ PAGESIZE）;

6. 在yourRemoteModel.js中，將jsonp調用更改爲ajax - 除非需要跨域執行此操作，否則您可以將其更改爲如下所示：

    req = $.ajax({ 
         url: url, 
         dataType: 'json', 
         success: onSuccess, 
         error: function(){ 
          onError(fromPage, toPage) 
         } 
         }); 
   

7. 在yourRemoteModel.js中，您現在必須自定義onSuccess（）函數。按照示例中的模式，設置從和到被整數偏移到數據記錄中，設置data.length爲總記錄數，然後設置數據數組。這段代碼依賴於來自服務器的JSON響應。

8. 現在將代碼寫入服務器以生成JSON響應。從步驟7可以看到，這需要在數據中包含記錄（或頁面）偏移量，並指出返回的記錄數量以及記錄本身的數組。請記住，每條記錄的每個字段都必須具有與列定義中的「字段」設置相匹配的屬性名稱（從上面的步驟4開始）。看看從Digg的反應爲例：

http://services.digg.com/search/stories?query=apple&offset=0&appkey=http://slickgrid.googlecode.com&type=javascript&callback=cb

而且應該這樣做！

*注意：在我的情況下，我不想使用帶寬返回JSON響應中每個記錄重複的所有屬性名稱，所以我返回一個記錄值數組。然後，我將列描述（上面的第4步）中的field屬性設置爲該數組中的整數偏移量。所以在列描述中，而不是字段：'someFieldName'，我使用字段：3，然後在我的遠程模型中，onSuccess（）函數我設置數據[來自+ i] = resp.record [i] .data（其中.data是記錄中字段值的JSON響應中的一個數組）。到目前爲止，這似乎對我很好（但如果出現錯誤，可能會更難調試）

Answer 3

請參閱此拉取請求。A functional AJAX Data Store Example now using HackerNews instead of Digg您可以下載this Slickgrid看看example6阿賈克斯加載

這裏擁有約分頁+ AJAX + slickgrid重要的觀察：Google Groups: SlickGrid Pagination + Ajax + DataView

Answer 4

對於任何其他人希望做這個檢查出這個slickgrid的叉子。 https://github.com/harbulot/SlickGrid

它增加了一個漂亮的小Python的服務器提供AJAX後端

git clone git@github.com:harbulot/SlickGrid.git 
cd SlickGrid/ 
python localajaxserver.py 

然後去http://127.0.0.1:8000/examples/example6b-ajax-localserver.html與您的瀏覽器。

看拉入請求，看看有什麼改變https://github.com/harbulot/SlickGrid/compare/mleibman:master...url_builder