ExtJS Grid Row Specific EmptyText？ [英] ExtJS Grid Row Specific EmptyText?

问题描述

我们的应用程序使用 Ext.grid.Panel 来显示数据行。当用户点击新建...按钮时，我们向网格存储添加新记录。一切都正常。

然而，在某些字段上，只有这个新的（至今尚未）未记录的记录，我们希望在某些单元格中显示特定的空文本。例如：在这里输入标题或选择一个平台。

我知道列上有一个emptyCellText属性，但是a）其破碎的，以及b）我想只在新的，不同步的（例如幻影）记录上发生这种情况。

由于我是这个框架的新手，任何想法都是最受欢迎的。

解决方案

您可以在列中添加此文本 renderer 。列值未设置，记录为幻像，在这种情况下，您可以添加到列中您的占位符文本：

 列：[
 {
 header：'Name'，
 dataIndex：'name'，
 editor：{
 xtype：'textfield'，
 emptyTe xt：'输入名称'
}，
 renderer：function（value，metaData，record）{
 if（！value&& record.phantom）{
 return'输入名称'; 
} else {
返回值; 
} 
} 
} 
] 
  

编辑

在编辑器字段中显示空文本只需使用 emptyText 编辑器配置中的config属性。在编辑器配置中，您可以通过 xtype 定义要使用的字段类型（ textfield ， numberfield 等），并添加任何字段配置属性：

 编辑器：{
 xtype：'textfield'，
 emptyText：'输入名称'，
 //其他提交的配置属性... 
}，
  pre> 
 
 
提供实例：  https://fiddle.sencha.com/#fiddle/3b5   
 
Our application uses the Ext.grid.Panel to display rows of data. When the user clicks a "New..." button we are adding a new record to the grid store.  Everything is working fine.

However, on certain fields, of just this new (as of yet) unsynced records, we would like to display specific empty text within certain cells.  For example: 'Enter title here'  or 'Choose a platform".

I know there is an emptyCellText property on Column, but a) its broken, and b) I'd like to have this happen only on new, unsynced (e.g. phantom) records.

As I am new to this framework, any ideas are most welcome.
解决方案
You can add this text in column renderer. You can test if record column value is not set and record is phantom. In this case you can add to column your placeholder text:
columns: [
    {
        header: 'Name',  
        dataIndex: 'name', 
        editor: {
            xtype: 'textfield',
            emptyText: 'Enter name'                
        },
        renderer: function(value, metaData, record) {
            if (!value && record.phantom) {
                return 'Enter name';
            } else {
                return value;
            }
        }
    }
]


Edit

For displaying empty text also in editor fields just use emptyText config property in editor configuration. In editor configuration you can define by xtype which type of field will be used (textfield, numberfield, etc.) and add any of field config propertis:
editor: {
    xtype: 'textfield',
    emptyText: 'Enter name',
    // other filed config properties...        
},
Fiddle with live example: https://fiddle.sencha.com/#fiddle/3b5

                        
这篇关于ExtJS Grid Row Specific EmptyText？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！