沒想到居然會需要看起來算 n 年前的 jqGrid…
(看起來不支援已經有幾年了
總之先列一下我落落長的參考資料在註腳1 。(太多了已經不確定有沒有漏掉的了QQ 新手努力參考)
嚴格來說我用的是 Guriddo jqGrid JS
前置
至少要引用的:(路徑替換為自己的、grid.locale-en.js
可以換自己需要的)
使用
我的簡易成果:(主要來自 ChatGPT,零散調整成我需要的長相)
其中可以設點屬性
height
、width
設定整個 grid 的寬高- 第二個
.jqGrid()
的第三個屬性 {} 是決定 toolbar 要不要有新增刪除編輯的小圖示 - 如果開編輯的話,
url
要設值否則會一直報 “Not Set a Url” 的問題。要設你想把編輯結果塞給哪個檔案 (例如某 .php 檔之類的)。若是純本地不傳值給後端,值要設 ‘clientArray’。 multiselect
: 各 row 前是否要有複選框- 若要對 colModel 中的誰做客製化 grid 外表時,使用屬性
formatter
。- 例如:想讓值如果是空白,預設顯示 x :
表單編輯
編輯:使用 checkbox 多值
來自 這個(grid 內顯示用) 跟 這個 (JS 內撰寫)
結果:
若要進階一點,設定表單編輯內欄位名稱自製,可以使用 beforeShowForm
的參數來調整。
Written with StackEdit.
JqGrid—功能強大的jQuery Grid Control
JqGrid How to change width of edit form? - Stack Overflow
Does jQuery jqGrid edit form support fields that are multiselect? - Stack Overflow
wiki:common_rules - jqGrid Wiki
ChatGPT
softwarenotes/javascript/jqgrid - 設計筆記.md at master · mrtony/softwarenotes
jqGrid 實用技巧 (十一) inline edit 及 confirm dialog before save | Mister Ngan
jqGrid Demos
JqGrid 教學(基礎配置) @ 討厭鬼教學 :: 痞客邦 ::
提姆備忘錄 Javascript jQuery Grid Control - jqGrid 簡介
第4個jqGrid範例: 資料列處理 – 簡睿隨筆
jQuery學習筆記–jqGrid的使用方法(編輯,刪除,更新,新增) ↩︎
Comments
Post a Comment