我正在使用帶有CellEditing插件的ExtJs網格。它的工作原理非常完美,除非無效值在我對其施加的驗證失敗時丟失。例如,如果網格中有一個不允許超過10個字符的值的可編輯文本字段,並且用戶輸入「olympicssucks」,則驗證將失敗,文本字段周圍會出現一個紅色框。當用戶點擊該字段時,值「olympicssucks」將丟失。帶有CellEditing的ExtJs 4 GridPanel:輸入的數據在驗證失敗時丟失
我想要網格仍然保存無效的數據,並保持它的紅色框。
另一種(也許更清晰),例如: http://dev.sencha.com/deploy/ext-4.0.0/examples/grid/cell-editing.html 嘗試編輯第一cellvalue: 「Adder's舌」,並使其爲空。注意紅色框和確認信息。現在點擊即可。驗證失敗將單元恢復其原始值,加法器的語言。
TL;博士:我的問題,重申,是我想保持無效值,但仍然有驗證顯示周圍一個紅色的盒子。我相信它是可能的,但它是如何完成的?
我已經試過:
- 我看着Ext.Editor,似乎有前途的,因爲它有一個名爲一個配置屬性revertInvalid,做正是我想要的。不幸的是,似乎CellEditing插件似乎沒有使用Ext.Editor。我試過在網格列的編輯器字段中提供Ext.Editor,但生成了不可編輯的文本。
- 我試過把revertInvalid無處不在我可以但這是一個遠射。
代碼:
var cellEditing = Ext.create('Ext.grid.plugin.CellEditing', {
clicksToEdit: 1
});
var grid = {
xtype: 'grid', store: dataStore, plugins: [cellEditing],
columns: [
{
text: 'Items', dataIndex: 'items', flex: 1, sortable : false,
editor: {
xtype: 'textfield',
validator: function(value) { //custom validator to return false when value is empty and other conditions}
},
//...
],
tbar: [{
xtype: 'button', text: 'Add ' + type,
handler: function() {
dataStore.insert(0, {items: 'New ' + type});
cellEditing.startEditByPosition({row: 0, column: 0});
}
}]
}
的completeEdit功能修復bug當您完成編輯單元格,這樣可以節省該商店的價值。網格是商店的代表。你可以玩弄細胞本身的css(比如在onsave上標記爲紅色),但是你不能使用傳統的「驗證器」函數。 (我知道至少) – Alex 2012-08-06 20:25:14
感謝您的回覆。我擔心我必須經歷煩人的解決方法。只是看到** revertInvalid **正好是我想要的,我希望GridPanel和CellEditing有類似之處。 – applepie 2012-08-06 21:08:38