如何使用JQuery Mobile顯示大型表格？

我們試圖在iPAD和桌面用戶的Web應用程序中使用jQM顯示一個大表（超過50列和100行）。如何使用JQuery Mobile顯示大型表格？

JQM對我們來說工作得很好，但在第一種可能性（一個分區中的純html表）中，即使有浮動頁腳，垂直滾動也能正常工作，但表格被水平截斷，水平滾動被禁用。然後我們嘗試使用不同的實驗性滾動視圖（JQM Scrollview），但如果我們通過DOM創建表，它根本不起作用。

有什麼建議嗎？在JQM中顯示大型表格的更好方法是什麼？任何測試的網格與jQM一起使用？

編輯： 我們在這裏增加了一個例子。 http://oterrada.webatu.com/test.html

來源

2012-01-09 Oriol Terradas

你可以添加一些例子嗎？鏈接到演示或東西？ – 2012-01-09 17:24:58

嗯一些測試http://jsfiddle.net/xQ9db/1/，我認爲對於移動設備，你將遇到一些問題。恕我直言，我會重新考慮佈局+1 – 2012-01-09 17:52:39

@PhillPafford，謝謝，你現在可以檢查我們想要做的一個例子。一個表格在html中，另一個表格在您用DOM按下按鈕時創建。 – 2012-01-10 08:32:57

這不是真正的證明，但你可以嘗試：

$('#dataContainer').scrollview();

來源

2012-01-11 14:08:39

解決方法是添加$（'＃dataContainer'）。scrollview（）;填充表後，但要小心，如果該部門有數據滾動=「真」，因爲如果它有，滾動不正確應用。

來源

2012-01-11 07:57:28

試試我的工作正在進行tableview插件利用我細絲responsive table patterns

點擊齒輪圖標最右邊沒有。

這將打開一個用戶可以決定的自定義jqm-select，他希望顯示哪些列。沒有「堅持」類的所有列都可以通過這種方式進行切換。源代碼中應該有足夠的信息來幫助您開始。從JQM listview（過濾，插入，...）中抽取很多，所以如果您熟悉JQM，您應該能夠找到解決方法。

來源

2012-01-18 15:31:59 frequent

有關jQuery Mobile的「tableview」插件的更多信息？我正在爲iPad編寫Web應用程序，並且每列的表格過濾非常重要。可以使用DataTables庫，但它不像插件那樣使用jQMUI。我不想使用DataTables的主要版本是因爲它使用jQueryUI進行樣式設計，並且與jQMobile的用戶界面不兼容（我最後一次嘗試）。 – 2012-04-11 15:51:06

想法相同，但添加dataTables提供的所有功能遠遠超過了我的頭。基本上我有兩個工作正在進行的版本的tableview。一個版本是「普通」=沒有任何功能，另一個版本是「增強」=使用dataTables，但我開始用我自己的JqueryMobile UI替換dataTables JQueryUI，因爲你提到的原因。我爲了我的目的而努力工作，但這遠遠沒有完成。 – frequent 2012-04-11 17:13:32

如何使用JQuery Mobile顯示大型表格？

回答

相關問題