2010-04-17 66 views
28

我最近寫了一個問題「jqGrid display default 「loading」 message when updating a table/on custom update」的答案。在寫回答的時候我想:爲什麼他使用addJSONData()函數刷新網格中的數據,而不是相對於更改URL setGridParam()並刷新jqGrid數據相對於trigger('reloadGrid' )?在開始時,我想推薦使用'reloadGrid',但在想到這個之後,我明白我不太清楚最好的方法是什麼。至少,我不能用兩句話來解釋爲什麼我更喜歡第二種方式。所以我決定這可能是一個有趣的討論主題。應該將jqGrid的用法addJSONData替換爲setGridParam()的用法,並觸發('reloadGrid')?

所以確切的說:我們有一個典型的情況。我們有一個網頁,至少有一個jqGrid和一些其他控件,如組合框(選擇),複選框等,它們可以讓用戶更改顯示在jqGrid中的信息的範圍。通常我們定義一些事件處理程序,如jQuery("#selector").change(myRefresh).keyup(myKeyRefresh) ,我們需要根據用戶的選擇重新加載jqGrid容器。

從另外的用戶輸入閱讀和分析的信息後,我們可以刷新jqGrid的容器中,至少有兩種方式:

  1. $.ajax()人工撥打電話,然後$.ajax呼叫jQuery.parseJSON()的成功或完全手柄內側(或eval)然後調用addJSONData函數jqGrid。我在stackoverflow.com上發現了很多使用addJSONData的例子。
  2. 更新URL的jqGrid的根據用戶的輸入,復位電流頁面數爲1,選擇更改網格的標題。所有這些都可以根據setGridParam()和可選的setCaption() jqGrid方法完成。最後調用網格的觸發器('reloadGrid')函數。按照我主要使用jQuery.param函數來確定的方式來構建網址url,我已經將所有url參數正確包裝在encodeURIComponent中。

我希望我們討論這兩種方式的優缺點。我目前使用第二種方式,所以我將從這個優勢開始。

可以這樣說:我打電話給現有的Web服務,將接收到的數據轉換成jqGrid格式並且調用addJSONData。這就是我使用addJSONData方法的原因!

好的,我會選擇另一種方式。 jqGrid可以直接在Web服務上調用並在網格中填充結果。有很多jqGrid選項可以讓你自定義這個過程。

首先,可以刪除或重命名發送到服務器相對於任何標準參數到prmNames的jqGrid的選項或相對於所述POSTDATA選項(參見http://www.trirand.com/jqgridwiki/doku.php?id=wiki:options)添加任何多個附加參數。可以在jqGrid通過定義serializeGridData()函數(jqGrid的另一個選項)發出相應的$.ajax請求之前立即修改所有構建的參數。除此之外,通過設置jqGrid的ajaxGridOptions選項,可以更改每個$.ajax參數。例如,我使用ajaxGridOptions: {contentType: "application/json"}作爲$.jgrid.defaults的一般設置。 ajaxGridOptions選項非常強大。相對於所述ajaxGridOptions選項一個可以重新定義$.ajax請求通過發送的jqGrid的任何參數,如誤差完整beforeSend事件。我認爲定義dataFilter事件可能會對從服務器返回的行數據進行任何修改。

使用觸發器('reloadGrid')的另一個參數是在AJAX請求處理期間阻塞jqGrid。大多數情況下,我使用參數loadui: 'block'在JSON請求發送到服務器期間阻止jqGrid。就jQuery blockUI插件http://malsup.com/jquery/block/而言,可以將網頁的更多部分作爲網格屏蔽。調用觸發( 'reloadGrid')方法和的jQuery( '#主')之前

jQuery('#main').block({ message: '<h1>Die Daten werden vom Server geladen...</h1>' }); 

解鎖()loadCompleteloadError函數中:要做到這一點可調用。 。在這種情況下,可以將選項設置爲「禁用」。

,我的最後一句話:主要是我用來與數據類型創建的jqGrid設置爲「當地」而不是「JSON」,我會打電話的觸發(「變化」)的一些控制功能(其中一個組合框)如: jQuery("#selector").change(myRefresh).keyup(myKeyRefresh).trigger('change')。 因此我構造的jqGrid的URL參數只在一個地方的變化把手的內部,改變數據類型爲「JSON」上述setGridParam()內部。

所以我不明白爲什麼函數addJSONData()應該永遠使用。

是否有人使用addJSONData()函數向我解釋了它的用法的好處?

爲了公平起見,我可以添加addJSONData(),它存在於舊版本的jqGrid中,因爲它具有我在此描述的大多數功能。是否應該用addJSONData jqGrid的用法替換爲的用法setGridParam()trigger('reloadGrid')

回答

0

這也是爲什麼我用addJSONData()...

就我而言,我有一個網頁包含數據網格,用來建立搜索條件的另一頁。

對網格頁面一無所知的搜索頁面包含7個字段。用戶可以填寫至少一個或全部七個字段。

提交時,搜索頁面會將數據格式化爲發送到服務器的JSON對象中的鍵/值對。

在服務器上,JSON數據被解析爲SQL WHERE子句。

SQL數據結果作爲HTTP響應中的JSON對象發送回客戶端,該響應也從服務器發送的代碼構建網格頁面。

據我所知,從HTTP響應中獲取JSON數據到網格的唯一方法是使用addJSONData()。

克里斯

+0

@ user43244:就像我在我的問題中描述的那樣,addJSONData不是從服務器獲取JSON數據的唯一方法。您可以定義jqGrid的'datatype:「json」'參數,如果jqGrid需要數據(如果頁面切換,更改排序順序和第一次填充原因),它將爲您發送請求給服務器。有時(取決於服務器軟件),您需要使用'ajaxGridOptions'來設置額外的ajax參數。你所做的是在http://stackoverflow.com/questions/2928371/how-to-filter-the-jqgrid-data-not-using-the-built-in-search-filter-box/2928819#2928819中討論。 – Oleg 2010-09-15 20:58:01

+0

即使我們有這樣的要求。請參閱http://stackoverflow.com/questions/7587255/using-jggrid-with-apiproviding-local-data-for-search-paging,讓我們知道如何避免使用'addJSONData' – CodeRain 2011-09-29 09:58:45

2

我一直在使用與jqGrid的addJSONData,但它是1年前,很多事情都因爲jqGrid的那段時間的變化。

無論如何,我需要在客戶端(銀行分享東西)複雜的gui操作,我的Json數據僅在本地,並作爲一些jkey點(作業完成)發送到服務器。我有幾個jqgrid(其中一些在其他人jqgrids :-))和某種本地瀏覽器存儲的數據,這些數據足夠小,可以保留在瀏覽器中,並且複雜並足以在通過ajax IO在合理的時間內無法使用。

第一個版本使用Ajax IO,當我被鎖和等待問題以及大量新的複雜的GUI事件發現時,我一直很高興地發現這個addJSONData掛鉤並擁有自己的ajax時間軸在jQgrid之外。

1

易於從服務器構建網格/數據。我使用JSON的一個主要原因是,它比XML小,並且在服務器(PHP)和客戶端(JS)兩方面都能很好地工作。結果,我標準化了(並且我知道有幾種)數據傳輸到JSON之間。

因此,addJSONData提供了一個簡單的方法來不斷更新網格中的所有數據,並將其一次性顯示。它快速,快速,骯髒,它的工作原理。

不過,從長遠來看,這將成爲一個壞主意,大數據網格不斷刷新。在那裏,在初始獲得之後更新特定的單元格/列,對於2次調用來說是更好的主意。將網格更改提交給服務器,並從服務器獲取更改。

因此,這樣做的主要優點之一就是它的快速入門。而當數據變得太大時,全部添加選項降級只會在開始時出現一次。儘管可以在初始數據抓取後添加單獨的更新/獲取。

它是一種良好的工作週期:快速原型 - >有效的客戶端 - 服務器數據網格

+1

感謝您的回答。我的問題是**很老**。當時我有60點的聲望點。 jqGrid具有已經有'ajaxGridOptions'和'serializeGridData'選項,但是當直接支持將JSON編碼數據發送到服務器時,舊版本的許多**舊示例**。所以我寫了這個問題來幫助其他人使用新的(當時)功能。如果你現在使用'addJSONData',你通常會忽略排序,分頁和過濾。嘗試點擊「原型」中的列標題。如果您發佈您的代碼示例,我將展示如何修改它。它會保持簡單 – Oleg 2011-06-12 09:14:49

0

當需要對AJAX如何以及何時被髮送的完全控制,你會更喜歡使用addJSONData

例如搜索表單包含兩個<select>框,這兩個框都是ajaxly populated的,第一個select的值會影響第二個框。用戶可能已經爲select框設置了默認值。只有在定義了兩個值後纔想搜索網格。

然後更可取的是使用諸如$.Deferred之類的東西來控制正在進行和填充的ajax調用的順序。當然你可以設置jqgrid的數據爲local,然後爲json,然後reloadGrid來控制觸發。但這不是那種瑣事。

+0

對不起,但你的例子是關於搜索窗體或編輯窗體,而不是填充網格的主體。 addJSONData方法在實現相關選擇的情況下無法幫助。 – Oleg 2012-12-17 06:17:41

+0

'',並且你想根據'