這幾天在使用LigerUI（版本為1.2.2）編輯表格組件的時候，遇到幾個小問題，從官方demo和api中沒有找到解決的辦法

問題1、從數(shù)據(jù)庫查詢出來的主鍵單元格不可編輯問題

主鍵單元格已經(jīng)保存之前編輯的數(shù)據(jù)，由于是主鍵，因此一旦保存就不需要再進(jìn)行修改

找到了一點(diǎn)兒線索，核心代碼如下：

onBeforeEdit: function (e){if (e.record.editTime) {e.record.id.enabledEdit = false;//dataGrid.reRender();}return true;}
其中，reRender()函數(shù)是從http://www.tuicool.com/articles/ZZnyu2F找到的，新版本沒有這個函數(shù)，雖然重新設(shè)置了單元格的enabledEdit屬性為false，但是不知道如何阻止編輯單元格，于是這個問題只能通過變通的方式解決

變通的解決方式為，在編輯完成后判斷當(dāng)前記錄是否已經(jīng)保存過，比如已經(jīng)有保存時間等屬性，如果已經(jīng)保存，就自動恢復(fù)成編輯之前的數(shù)據(jù)，核心代碼如下：

onBeforeSubmitEdit: function (e) {//查詢出來的數(shù)據(jù)id不能修改if (e.column.name == "id" && e.record.editTime) {return false;}}雖然，變通解決了不能修改的問題，但是理想的效果是單元格不可編輯

問題2：單元格校驗問題

可編輯的表格，其中的數(shù)據(jù)有些是需要進(jìn)行格式、業(yè)務(wù)校驗的，雖然有人在ligerGrid的columns中寫了validate屬性，但是不知道如何觸發(fā)其中的校驗規(guī)則，設(shè)置的校驗不能觸發(fā)，肯定是不能起作用的，于是這個問題也需要找個變通的方式解決

變通的解決方式為，在保存之前，對每行的數(shù)據(jù)進(jìn)行校驗，遍歷每行數(shù)據(jù)的核心代碼

function validateGrid() {var rows = dataGrid.rows;for (var i = 0; i < rows.length; i++) {if (rows[i].id.length == 0) {$.ligerDialog.warn("第"+(i+1)+"行[編碼]不能為空");return false;}if (rows[i].name.length == 0) {$.ligerDialog.warn("第"+(i+1)+"行[名稱]不能為空");return false;}}return true;}雖然，解決了數(shù)據(jù)校驗問題，但是校驗不通過的單元格，顯示效果和校驗通過的一樣，效果不是很好

LigerUI使用起來比較簡單，作者也半年左右升級一次，api雖然已有在線版的http://api.ligerui.com/，但是api函數(shù)沒有名稱排序，找起來不是很方便，有些函數(shù)沒有在api中體現(xiàn)出來，只能查看源碼或者開發(fā)工具調(diào)試才能找到相關(guān)的調(diào)用方法，不過還是要贊一個，支持免費(fèi)、開源的LigerUI

總結(jié)

以上是生活随笔為你收集整理的LigerUI编辑表格组件单元格校验问题的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。