如何手动移除Ext JS 6.0.0表格单元格的红色脏数据标记？

既然你的表格没有关联store，没法用store.commitChanges()这类常规方法，那我们直接从单元格的视觉标记和组件状态入手来解决：

方法一：批量清除所有脏标记 #

在AJAX请求的success回调里，你可以遍历表格的所有单元格，移除脏样式和小红点标记：

success: function(response, opts) {
    // 先获取你的表格实例，这里假设你用ID获取，或者用你已有的引用
    const myGrid = Ext.getCmp('your-grid-unique-id');
    // 遍历表格的每一列
    myGrid.columns.forEach(column => {
        // 找到当前列下的所有单元格元素
        const cellElements = myGrid.getView().getEl().query(`.x-grid-cell-${column.id}`);
        Ext.Array.each(cellElements, cellEl => {
            const cell = Ext.get(cellEl);
            // 移除脏单元格的CSS类（这是红色背景/边框的来源）
            cell.removeCls('x-grid-dirty-cell');
            // 移除单元格内的小红点标记元素
            const dirtyIcon = cell.down('.x-grid-dirty-icon');
            if (dirtyIcon) dirtyIcon.destroy();
        });
    });

    // 如果你用了CellEditing插件，还要清除编辑记录的脏状态
    const cellEditor = myGrid.getPlugin('cellediting');
    if (cellEditor) {
        const activeRecord = cellEditor.getActiveRecord();
        if (activeRecord) {
            // 清除整个记录的脏标记
            activeRecord.setDirty(false);
            // 如果你只想清除特定字段（比如你修改的pressure），可以用这个：
            // activeRecord.commit('pressure');
        }
    }
}

方法二：精准清除单个修改的单元格 #

如果你明确知道修改的是哪一行哪一列的单元格，不用遍历所有单元格，直接定位操作更高效：

success: function(response, opts) {
    const myGrid = Ext.getCmp('your-grid-unique-id');
    // 假设你知道目标行的索引，以及修改字段对应的dataIndex
    const targetRowIndex = 0; // 替换成你实际的行索引
    const targetColumn = myGrid.columns.find(col => col.dataIndex === 'pressure');

    if (targetColumn) {
        // 获取目标单元格的DOM元素
        const cellEl = myGrid.getView().getCell(targetRowIndex, targetColumn);
        const cell = Ext.get(cellEl);
        // 移除脏样式和标记
        cell.removeCls('x-grid-dirty-cell');
        const dirtyIcon = cell.down('.x-grid-dirty-icon');
        if (dirtyIcon) dirtyIcon.destroy();

        // 如果表格有隐性的记录（哪怕你没关联store），也可以清除字段的脏状态
        const record = myGrid.getStore()?.getAt(targetRowIndex);
        if (record) {
            record.commit('pressure');
        }
    }
}

核心原理说明 #

• 红色脏标记的视觉效果来自两个部分：单元格的x-grid-dirty-cell CSS类（控制红色背景/边框），以及单元格内的.x-grid-dirty-icon元素（那个小红点），只要移除这两个就能消除视觉标记。
• 如果用了单元格编辑插件，还要同步清除编辑记录的脏状态，避免后续操作出现异常；如果完全没有store，只处理DOM部分就足够了。

内容的提问来源于stack exchange，提问作者Dirk Schumacher