如何在 Ext 4 网格面板中仅启用新行？

Posted 2023-02-26

【中文标题】如何在 Ext 4 网格面板中仅启用新行？

【英文标题】：How do I enable only new rows in a Ext 4 Grid Panel?

【发布时间】：2011-06-30 20:32:03

【问题描述】：

所以我有一个ExtJs 4 Grid Panel，它有两列。

列 ONE 是带有自定义渲染器的 ComboBox

Ext.ux.comboBoxRenderer = function(combo) 
    return function(value) 
        var idx = combo.store.find(combo.valueField, value);
        var rec = combo.store.getAt(idx);

        return (rec == null ? '<img src="/js/extjs4/resources/themes/images/default/grid/loading.gif" />' : rec.get(combo.displayField) );
    ;

列TWO是数字列

  allowBlank: false,
  header: 'Time',
  dataIndex: 'tedPaidTime',
  align: 'right',
  field: 
     xtype: 'numberfield',
     allowBlank: false,
     minValue: 0,
     maxValue: 100000
  ,
  flex: 0.20,
  selectOnFocus:true

现在，当我加载 DataStore 时，我希望 FIRST 列是只读的。如果我设置 ReadOnly 标志，这很容易。

但是，我有一个按钮，用于添加要存储的 NEW 记录，并且我希望该新记录没有只读标志。

所以基本上，一旦你改变第一列并保存，你就不能改变它。只能在保存新记录之前更改它们。

这里的业务规则要求他们删除不正确的旧记录。

谢谢。

【参考方案1】：

我自己解决了这个问题。

基本上，我在selectionchange 事件中记录了组合。 然后，在focus 事件中，我检查了它是否有来自商店的所需数据密钥。如果不是，那么我假设一个新行并运行以下内容：

focus: function(combo) 
           var cb = combo;
           if(newTEDetailRecord) 
              if(newTEDetailRecord.data["activityKey"] == "") 
                 console.log("newTEDetailRecord", newTEDetailRecord);
                 cb.setEditable(true);
                 cb.setReadOnly(false);
                 cb.focus();
                 cb.selectText();
               else 
                 cb.setReadOnly(true);
              
           
        ,