在网格面板中动态更改extjs4网格文本框的背景颜色
Dynamically change extjs 4 grid textbox background color in grid panel
我对一些网格组件(rangeFrom&rangeTo)进行了自定义验证
如果任何验证失败,我想将markDirty设置为true,这样无效的字段就会显示为错误状态,用户可以看到哪个字段是错误的。
if (record.get("type") === "ROW_HEIGHT" && record.get("apply_before") === true)
{
var rangeFrom = record.get("range_from");
var rangeTo = record.get("range_to");
if ((rangeFrom !== "") && (rangeTo !== "")) {
if ((rangeFrom.match(/[^0-9]+$/) !== null) || (rangeTo.match(/[^0-9]+$/) !== null)) {
if (rangeFrom.match(/[^0-9]+$/) !== null){
**MARK rangeFrom Dirty here**
}
isValid = false;
}
else if (rangeFrom > rangeTo) {
isValid = false;
}
else if ((rangeFrom < "2") || (rangeTo < "2"))
isValid = false;
}
else if ((rangeFrom === "") || (rangeTo === "") || (rangeFrom === null) || (rangeTo === null)) {
isValid = false;
}
else
isValid = true;
基本上,任何时候验证失败(当isValid=false时),我都希望将rangeFrom或rangeTo标记为脏,这取决于哪个字段包含无效值。
当前验证接受任何数值>=2的条目。如果没有输入任何内容(空白/null)或数值>=2旁边的任何内容,则该字段应标记为脏。
您需要记录字段的td
单元格,然后添加以下类别x-grid-dirty-cell
:
var node = grid.getView().getNode(record);
Ext.query('td:nth-child(x)', node).className += ' x-grid-dirty-cell'; // x is the column-index
我找到了问题的答案。以下是我如何让它在网格组件中进行单元格验证。这将检查验证,并将网格中的单个单元格标记为无效
if (record.get("type") === "ROW_HEIGHT" && record.get("apply_before") === true)
{
var rangeFrom = record.get("range_from");
var rangeTo = record.get("range_to");
if ((rangeFrom !== "") && (rangeTo !== "")) {
if ((rangeFrom.match(/[^0-9]+$/) !== null) || (rangeTo.match(/[^0-9]+$/) !== null)) {
var store = MrEditor.excelLayout.overrideColumnGrid.getStore();
var view = MrEditor.excelLayout.overrideColumnGrid.getView();
var error = false;
var rangeFromFailed = false;
var rangeToFailed = false;
var columnLength = MrEditor.excelLayout.overrideColumnGrid.columns.length;
for (var i = 0; i < columnLength; i++) {
var cell = view.getCellByPosition({row: idx, column: i});
cell.removeCls("x-form-invalid-field");
cell.set({'data-errorqtip': ''});
var fieldName = MrEditor.excelLayout.overrideColumnGrid.columns[i].dataIndex;
if (fieldName === 'range_from') {
rangeFromFailed = false;
if (rangeFrom.match(/[^0-9]+$/) !== null)
rangeFromFailed = true;
if (rangeFromFailed) {
cell.addCls("x-form-invalid-field"); //add default invalid styling to fcell in error state
cell.set({'data-errorqtip': 'Range From must be NUMERIC'}); //custom error message
error = true;
}
}
else if (fieldName === 'range_to') {
rangeToFailed = false;
var cell = view.getCellByPosition({row: idx, column: i});
if (rangeTo.match(/[^0-9]+$/) !== null)
rangeToFailed = true;
if (rangeToFailed) {
cell.addCls("x-form-invalid-field"); //add default invalid styling to fcell in error state
cell.set({'data-errorqtip': 'Range To must be NUMERIC'}); //custom error message
error = true;
}
}
}
isValid = false;
}
相关文章:
- 如何在可分组的剑道网格中设置空数据文本
- Extjs 4网格:根据存储文本值在单元格中放置图标
- ExtJ将工具提示添加到网格单元格文本中
- 在网格视图的自动刷新过程中,设置内部网格视图文本框的可见性
- 点击剑道网格的编辑,在剑道窗口中填充文本框/DDL
- 如何在网格视图中验证asp.net文本框
- 如何使用angularjs在剑道网格过滤器文本框中应用电话号码掩码
- AngularJs的Kendo UI:当用户在网格中选择行时,如何在文本框字段上绑定数据
- JavaScript中的网格视图页脚行文本框
- 在客户端的编辑模式下,在同一单元格网格视图中选中复选框时禁用文本框
- 如何绑定网格'使用Telerik的带有文本框的数据源
- 如何在嵌套网格视图中查看子网格的页脚模板文本框
- 在 Dojo 增强网格筛选器栏上设置状态文本
- 剑道网格单元格 :如何自动修剪文本以避免换行
- 为什么我的文本网格不恒定旋转
- AngularJS ui网格文本对齐
- 引导网格文本书写
- 获取网格文本框的值
- 在网格面板中动态更改extjs4网格文本框的背景颜色
- 剑道网格文本选择在单元格/表内与多选启用