ExtJS 4:将默认值应用于网格中的所有列
关于ExtJS 4，它是一个基于JavaScript的开源Web应用程序框架，用于构建高性能、可扩展的Web应用程序。ExtJS 4是ExtJS框架的第四个版本，它提供了许多新功能和改进，包括更快的渲染速度、更好的性能、更简单的API和更丰富的组件库。
在ExtJS 4中，网格组件是一个非常重要的组件，它允许开发人员轻松地显示和操作大量数据。在网格中，列是用于显示数据的主要单位。要将默认值应用于网格中的所有列，可以使用以下方法：
- 使用列模板：
在列模板中，可以定义一个默认值，这个值将应用于该列中的所有单元格。例如，如果要将默认值“N/A”应用于所有的列，可以使用以下代码：
columns: [
{
text: 'Column 1',
dataIndex: 'column1',
cell: {
xtype: 'gridcell',
bind: '{record.column1} || "N/A"'
}
},
{
text: 'Column 2',
dataIndex: 'column2',
cell: {
xtype: 'gridcell',
bind: '{record.column2} || "N/A"'
}
}
]- 使用数据模型：
在数据模型中，可以定义一个默认值，这个值将应用于该模型的所有实例。例如，如果要将默认值“N/A”应用于所有的列，可以使用以下代码：
Ext.define('MyModel', {
extend: 'Ext.data.Model',
fields: [
{ name: 'column1', type: 'string', defaultValue: 'N/A' },
{ name: 'column2', type: 'string', defaultValue: 'N/A' }
]
});然后，在网格中使用这个数据模型：
Ext.create('Ext.grid.Panel', {
store: {
model: 'MyModel',
data: [
{ column1: 'Value 1', column2: 'Value 2' },
{ column1: 'Value 3' },
{ column2: 'Value 4' }
]
},
columns: [
{ text: 'Column 1', dataIndex: 'column1' },
{ text: 'Column 2', dataIndex: 'column2' }
]
});在这个例子中，如果某个单元格的值为空，则会显示默认值“N/A”。
总之，要将默认值应用于网格中的所有列，可以使用列模板或数据模型来实现。这两种方法都可以轻松地将默认值应用于所有列，并且可以根据需要进行自定义。
相关·内容
1回答
我需要在extjs网格中实现过滤器。在网格中，每列的第一行将用作筛选器。具有Excel的过滤器的功能。有没有人看过这样的例子？
例如，如果我显示投资组合的所有股票和交易日期，我需要在第一列中显示所有可用股票和可用交易日期。
浏览 1提问于2011-12-05得票数 1
我的模型有一个定义如下的字段。
{
name: 'ed_price',
type: 'number'
}
网格面板中的列的编辑器配置为
editor: {
xtype: 'numberfield'
}
我只需单击一下就可以在网格上启用celledit。当我单击此列进行编辑时，我在数字字段中看到默认值0。怎样才能删除它？
我已经在字段定义上尝试了以下配置。
defaultValue: null,
allowNull: true
defaultValue: undefined
浏览 2提问于2015-03-18得票数 0
1回答
我有两个网格(Ext.grid.Panel)：左边的和右边的。
两个网格都有相同的行数。但是左边的一个网格列是一个复选框，所以左边的行要高出1px。
如何根据左行高度设置正确的行高？
浏览 3提问于2014-03-06得票数 0
回答已采纳
在ExtJS 3中，您可以在网格上将enableHdMenu设置为false，以删除列名末尾的小触发器，该触发器具有包含排序方向和隐藏列的选项的下拉菜单。
如何在ExtJS 4中隐藏此触发器和菜单？我知道可以将enableColumnHide设置为false来删除隐藏选项，但我希望完全删除触发器。
浏览 1提问于2011-07-22得票数 0
回答已采纳
日安。我正在开发一个web应用程序。我有一个表单，其中我有一个网格面板。我希望网格面板在它周围和列之间有一个边框。我已经在网格视图中做到了这一点，然而，我正在努力在列标题上设置边框。下面是我的网格面板的外观：
正如您所看到的，网格视图(列标题下面的那个)在它们周围有边框，而列标题没有。下面是我使用的CSS资源：
.child-row .x-grid-cell{
font-size: 17px;
font-weight: bold;
font-style: italic;
font-family: 'Times New Roman'
浏览 0提问于2014-11-06得票数 1
回答已采纳
1回答
我成功地在ExtJs3中动态加载了网格列。
然而，我没能让它在ExtJs4中工作。
我可以动态加载这些列，但不能让它们显示在网格中。
当存储加载时，我构建了一个列模型，然后将网格列设置为这个列模型。在设置网格列之后，我尝试调用grid.doLayout()方法和grid.getView().refresh()方法，但这些列从未显示过。
下面是一些示例代码：
store.on('load', function(st){
var columnModel = store.data.items;
grid.columns = columnModel;
grid.
浏览 3提问于2011-06-02得票数 2
回答已采纳
1回答
我有一个网格，显示来自数据库的数据，有时一些单元格是空的，因为在数据库的列中没有数据。有时数据是“未定义的”。因此，我需要在网格中显示这两种情况下的文本"No Data“。我读到我可以用渲染器做这件事，但仍然不知道怎么做。
浏览 0提问于2012-12-11得票数 2
回答已采纳
3回答
当在列'Email‘上触发网格面板排序时，如何强制先对列'Name’执行ASC排序，然后让EXTJS对列'Email‘执行排序。
我发现下面的例子是正确的。
当用户单击列排序时，我不知道如何在网格面板中实现这一点，示例中使用了针对商店排序的按钮，我认为我可以使用的是gridpanel ...but directly...the事件，但它是一个后期排序事件。
我创建了一个小提琴示例，其中我在商店中放置了一个分类器
sorters: [{
property: 'Name',
direction: 'ASC'
}],
但是在对网
浏览 0提问于2015-02-24得票数 0
1回答
我在这里遇到了一些概念问题。
我不得不为我的每一张桌子写一个搜索窗口。此窗口仅在组合框内容(要搜索的字段名称)和网格列(结果)中发生变化。
在extjs中，最好的方法是什么：
编写一个基窗口，并在子类中定义组合列和网格列。
为每个窗口编写不同的类？
特别是我更喜欢第一个选项，但是我正在从子类中配置这个属性。
浏览 4提问于2012-10-30得票数 0
回答已采纳
我有一个Ext.grid.EditorGriPanel，它的columnModel中有一个combobox编辑器( combox的存储只有两个条目:已启用/禁用)。当一个新的空白行插入到网格中时，我希望该列中的组合框必须设置为默认值(已启用)，并且不展开下拉列表。我尝试过使用grid.colModel.columns[2].editor.select(0)来获取combobox编辑器并为它设置“启用”值，但是它没有工作。另一种方法是使用grid.colModel.columns[2].getCellEditor(rowIndex)，但是它返回一个EditorGrid (我很惊讶，因为ExtJS
浏览 4提问于2011-04-13得票数 0
我们为加载掩码创建了一个自定义的混合，我们需要有条件地将这种掩蔽应用于锁定的网格，我们如何有条件地将混合设置到网格中？
浏览 2提问于2018-05-02得票数 0
回答已采纳
2回答
在我的项目中，我想根据在另一列中定义的特定值在另一列中添加不同的图片。我可以添加图片，但不能添加If条件。我的代码：
initComponent: function() {
this.columns = [
{header: 'ID du CPE', dataIndex: 'ID', flex: 1},
{header: 'Modèle', dataIndex: 'Modele', flex: 1},
{header: 'Firmware', dataIndex: 'f
浏览 0提问于2013-06-12得票数 1
回答已采纳
3回答
我在extjs4中搜索了一种方法来查找动态的网格列，因为我编写了一个函数来显示编辑器网格中的错误。在版本3中，我对它进行了修改
getColumnModel().findColumnIndex(cellname);
但是栏目模型已经不存在了，有没有人有主意？
问候
浏览 0提问于2011-06-07得票数 6
1回答
我正在使用Extjs创建UI。所以我用列创建了网格。我的任务是向某些单元格中添加工具提示，但只在部分文本上添加。我试着使用meta.tdAttr = 'data-qtip="Activity is in use"';看起来很有效，但在整个单元格上设置工具提示，而我只想在某些文本上使用。
以下是我的体会：
{
hideable : false,
width : 200,
浏览 1提问于2015-03-24得票数 0
回答已采纳
当单击/选择行时，我希望将样式应用到网格面板中的行中的特定列。我可以使用rowClick事件来捕获上面的事件，并应用特定于该行的任何样式。但是，当我单击网格中的不同行时，我也想恢复任何行上应用的样式。
我想到的一个想法是为之前点击的行维护一些状态。有没有更简单的方法来实现上述目标。
浏览 0提问于2011-01-06得票数 0
1回答
我正在使用ExtJS 4并使用MVC方法。我创建了一个简单的网格视图类，并在我的控制器中向该视图添加了一个组件查询类型'ref‘。在初始网格视图本身中，我设置了几个要隐藏的列，一些在默认情况下是可见的。具有这些设置的网格呈现都很好。
然后，我有了一个按钮，当单击该按钮时，基于其他一些条件，它将使一些最初隐藏的网格列可见。这也很管用。
但是，我需要的是一种稍后将网格“重置”到其初始视图的方法(与最初一样，正确的列隐藏/可见)。
我尝试过以下各种排列，但都没有效果：
var theGrid = this.getTheGrid();
theGrid.reconfigure(store, th
浏览 0提问于2013-01-25得票数 2
回答已采纳
5回答
我知道我可以使用代码隐藏网格列标题。
#gridid .x-grid3-hd-row { display:none; }
但我不想使用任何CSS更改。如何使用JavaScript做同样的事情？
浏览 2提问于2010-01-06得票数 11
回答已采纳
1回答
我有一个3列5行的网格。
我已经在网格上附加了一个CellEditing插件。在第三栏中，我定义了一个数字域教具。
因此，由于这一点，每一行第三列都有一个数字字段编辑器附在上面。
但是，由于数据/列元数据中存在某些条件，我希望禁用第2行和第4行的数字字段编辑器。
由于编辑器附加在列级别，因此无法禁用特定行的单元格编辑器。
在ExtJS中是否有一种方法来处理这种场景。
我正在使用ExtJS 5。
浏览 3提问于2016-09-22得票数 0
回答已采纳
1回答
我需要知道是否可以创建一个嵌套的treegrid，其中每个级别都包含它自己的一组列。类似于如果我创建了一个显示这两个类的网格：
public class Class
{
public int Id { get; set; }
public string ClassName { get; set; }
public string Teacher { get; set; }
}
public class Students
{
public int Id { get; set; }
public string StudentName { get; set;
浏览 1提问于2013-12-13得票数 0
回答已采纳
Extjs 3.3.1的方法setRenderer()为
/**
* Sets the rendering (formatting) function for a column.
*/
setRenderer( Number col, Function fn ) : void
现在我在setRenderer的ExtJS 4中没有得到任何方法。那么如何在运行时在ExtJS 4中格式化网格列呢？
浏览 0提问于2011-05-26得票数 2
我开发了一个带有单一存储和网格的页面，用于显示数据库查询中的项目。自那以后，这个简报已经扩展到包括通过拖放对网格中的项目进行动态分组。
已经决定通过在客户端创建多个存储和网格来实现此功能，这样单个GET请求将为网格提供所有条目。
加载初始“主存储”后，loaded函数遍历“主存储”中的数据，并创建新存储(为所述存储选择记录)，并为每个存储创建新的网格。网格将具有从内容动态生成的标题，但是将有简单的in来表示数据库中的组。
然后，用户根据需要将每个网格中的项拖放到其他网格中，从“旧”存储中移除该项并在“新”存储中创建该项，在此过程中还将更改其组id。
用户还可以创建新的组，生成空白存储和伴随的网
浏览 3提问于2014-02-06得票数 1
回答已采纳
1回答
我正在使用EXTJS4。我有一个树，它在一侧显示类(类名)。在单击类名称时，我希望能够在单独的网格中显示属于该类的对象。这些对象将使用ajax和json格式从服务器获取。问题是每个类都有不同数量的属性(列)，所以我不能静态地决定列。如何为每个类动态创建网格列？首先需要从服务器获取列数。
谢谢
浏览 3提问于2012-03-05得票数 3
回答已采纳
我有一个简单的网格，其中一列是“下载”链接，如下所示：
{
header: 'Config files',
width: 130,
sortable: false,
fixed: true,
renderer: function() {
return '<a href="javascript:void(0);" class="downloadCfg">Download</a>';
}
}
这是视图中的内容。现在转到控制器，我在网格上放置了一个侦
浏览 0提问于2012-01-07得票数 1
回答已采纳
我想在网格面板的列名之前添加“选择/取消选择所有列”复选框，以显示/隐藏所有列。由于网格中有大量列，所以用户希望选择all，然后取消选中要隐藏或取消选择的全部，然后检查要显示的列。我使用的是ExtJS 3.4版本。
例如，在示例网格中的列树下的列表中，选择/取消选择所有复选框应该放在名字之前：
谢谢!
浏览 13提问于2022-01-21得票数 0
如果列单元格值> 5000，我希望突出显示整行。现在我只能突出那个细胞。
网格列渲染器：
renderer:function(val_, meta_, rec_) {
if(val_> 5000) {
meta_.style = "background-color:red;";
}
}
浏览 1提问于2015-06-09得票数 2
回答已采纳
2回答
我在Extjs中具有继承，我希望将一个子类属性与父类属性合并(本例中为列)。
Ext.define('MyApp.view.Child', {
extend: 'MyApp.view.Parent',
title: 'Action Column Child extend ',
alias: 'widget.childpanel',
initComponent: function () {
//this merging very odd.
this.co
浏览 0提问于2013-12-16得票数 0
回答已采纳
1回答
在一个有5列的网格中，我希望只对第2列和第4列进行排序。实现此操作的正确demarch是什么？-将第2列和第4列的sortable声明为true -还有什么？
浏览 2提问于2012-04-20得票数 0
回答已采纳
3回答
我对ext-js很陌生。
我有一个容器网格，我需要做的是:如果一行中的2列之间的差值大于2，那么行应该是红色的。
我想不出怎么做。
columns: [
{
xtype: 'gridcolumn',
dataIndex: 'val_1',
浏览 1提问于2013-08-01得票数 1
回答已采纳
2回答
我在Extjs中有一个GridStore，它可以用两个网格列存储记录。我有一个问题，当网格中存在一条记录时，如果我删除网格，它在服务器端被成功删除，但它仍然存在于网格中。
示例代码：
xtype: 'grid',
store: 'SampleStore',
border: false,
width : 542,
ref: '../sampleGrid',
id: 'sampleGrid',
columns: [
{
xtype: 'grid
浏览 2提问于2013-07-24得票数 6
回答已采纳
这看起来应该很简单，但我就是做不到(我甚至不需要动态完成它)。例如，假设我有一个简单的两柱轴网设置，如下所示：
columns : [
{header: 'USER', dataIndex: 'firstName', width:70, cls: 'red'},
{header: 'CATEGORY', dataIndex: 'category', width:100}
]
cls: 'red'属性只影响标题，而不影响实际的列。我在其他地方看
浏览 1提问于2011-07-13得票数 5
回答已采纳
我在slickgrid中有一个列，其中所有的单元格都需要在单元格的右侧应用一些填充。我在初始化网格的列时使用了cssClass属性，但这只适用于列的非标题单元格。我如何指定一个css类也用于标题，这样我就可以对它应用正确的填充？如果没有填充，标题单元格就会与其下的其他单元格稍有脱节。
浏览 2提问于2012-02-23得票数 6
回答已采纳
所以我在MVC中有一个标准的Kendo网格，其中有两个不可编辑的列。我想要实现的是，仅在新添加的行中启用所有列的编辑。
例:网格中已经有4行，前2列是不可编辑的。用户点击“添加新的”，一个新的记录出现在网格中，所有内容都可以编辑。
浏览 2提问于2018-03-13得票数 1
1回答
是否有一种方法可以在ExtJS3.4中动态地向网格面板添加列？
我正在尝试向我的网格面板中添加一个行扩展列。
就像one (第一个插件)
我可以通过修改ui.js并手动添加一个列(如中的列)来实现这一点，但我试图不这样做。
任何解决办法都将受到高度赞赏！
编辑：我为ExtJS4找到了。
浏览 3提问于2012-08-13得票数 1
回答已采纳
1回答
我正尝试在我的网格中为特定的列创建一个工具提示。
在我的网格中，我需要第一列和第三列的工具提示。(名称和phNo。)
小提琴-
浏览 1提问于2018-09-30得票数 0
2回答
表格上的基础网格系统？
、、、
我有一张桌子，像：
<table>
<thead>
<tr>
<td>Col1</td>
<td>Col2</td>
<td>Col3</td>
</tr>
<tbody>
...
</tbody>
</table>
我想在我的桌子上使用。例如，我希望指定我的列的大小为2、4、6，这将给出基础网格系统的12列。
我试过这个SCSS：
.trow {
@include grid-row();
浏览 4提问于2015-10-08得票数 0
在我的extjs面板中，我有一个包含三个网格的hbox。我设置了以下内容: grid1: flex 1、grid2: flex 3、grid3: flex 1--工作得很好。现在，如果您查看grid1的图片，有四列，但您只能看到3，底部有一个滚动条。
如何缩小网格中的信息，使所有列都显示在flex1的分配空间中？
如果看一下列的宽度，就会有很多额外的空间。谢谢!
浏览 3提问于2016-05-12得票数 0
回答已采纳
我有一个Extjs编辑器网格面板，在这个面板中，我必须根据另一个列值的值来更改一个列的css，然后如何做，我不能使用呈现器函数，因为它在onload上工作，我是否有其他方式附加代码，在其中我有性别列和id列，所以当性别列选择男性时，ID的背景颜色应该更改为粉红色，否则就不能这样做。
{
id: 'value',
name: 'value',
header: 'Gender',
dataIndex: 'insured',
浏览 3提问于2013-02-27得票数 1
1回答
在网格中可以有“按行”的列定义吗？
例如，我需要一个这样的网格：
id | name | options
======================================
int | string | combobox(1,2,3)
int | string | combobox(1,2,3,4,5)
int | string | combobox(1,2,3)
int | string | combobox(5,6,7)
组合框可能的值是在initialization...is中为该列定义的，有没有一种方法来定义每一
浏览 1提问于2012-09-25得票数 1
回答已采纳
1回答
我有一个有16列的网格。我想要下面的场景-
我希望前5列和最后一列被锁定。我可以使用locked:true做到这一点。
但这会将最后一列和前5列一起带到网格的左侧。
我可以让最后一列回到原来的位置，也就是最后一列，并锁定前5列和最后一列吗？
我正在使用ExtJs-4.0.7
谢谢!
浏览 0提问于2012-06-07得票数 0
回答已采纳
我正在定义一个有selModel的网格。
每次加载存储时，都会使用grids 方法动态重新配置网格列。
然而，当我这样做的时候，网格selModel消失了。
如何将栅格列重新配置为也包含selModel。
下面是一些示例代码：
//The Selection Model for the grid.
var sm = new Ext.selection.CheckboxModel();
//The Grid
var grid = new Ext.grid.Panel({
store: store,
selModel: sm,
columns:[{
浏览 0提问于2011-06-08得票数 2
回答已采纳
1回答
我需要实现像网格一样的控件，它利用一些复杂的自定义小部件来查看和显示行。就像这个一样：
这里的关键点是，右列中的控件取决于在左列的组合框中选择的值。
有人知道使用ExtJS 5.0组件实现它的最佳方式是什么吗？我是否应该创建自己的小部件来显示同时用作自定义渲染器和编辑器的行数据？
浏览 1提问于2014-11-05得票数 0
2回答
我有2个商店和1个网格面板。一个存储被分配给网格，另一个在我的应用程序开始时加载记录。
现在，我的问题是，当我为我的网格面板中的列使用呈现函数时，我想要访问otrher存储的记录。然而，另一个存储并不总是准备好的，并且在呈现时刻并不总是充满记录。
这个问题的可能解决方案是什么？
非常感谢你，大卫
浏览 2提问于2012-05-03得票数 1
我有一个ExtJs网格，其第一行用作临时行。在网格中某些列是不可编辑的。我想显示第一行不可编辑的单元格(临时的)为不可编辑的.由于该临时行没有任何值，因此如何将这些单元格显示为不可编辑的(例如只将该单元格灰化)
如图片中所选，我想将这些单元格显示为灰色。
浏览 1提问于2017-09-07得票数 0
我有一个网格，我需要向网格单元格的TD添加一个属性(不是标头，而是网格本身的单元格)。它可能是列标题上的相同文本，所以在创建列时，我只想在gridcolumn x类型中定义它。在进行一些研究时，我发现了一个tdAttrs配置，我认为这会有所帮助，但我并不完全确定如何实现它。有人能给我指点吗？如果这不是正确的方向，请让我也知道。
而且，我需要将它添加到我的应用程序中的所有gridcolumn中，所以我是需要为ext.grid.column.Column添加一个覆盖，还是将其放在其他地方？
浏览 1提问于2014-11-25得票数 0
回答已采纳
这是我的网格列
MyColumn3Ui = Ext.extend(Ext.grid.NumberColumn, {
constructor: function(cfg) {
cfg = cfg || {};
MyColumn3Ui.superclass.constructor.call(this, Ext.apply({
dataIndex: 'ID',
header: 'name',
sortable: true,
width
浏览 3提问于2013-12-20得票数 0
我使用的是Extjs 4.1网格面板。
我正在寻找一种从网格中隐藏列的方法。我可以使用setHidden，但是用户可以再次从列标题的菜单中“取消隐藏”该列。看起来隐藏的属性并不能解决问题...
浏览 0提问于2012-10-18得票数 1
回答已采纳
2回答
我已经制作了一个网格dat，可以动态地在其中追加列。网格中的静态列不会失去按asc或desc顺序排序的能力。但对于动态添加的列，升序排序和降序排序选项不起作用。需要帮助..提前感谢..
浏览 3提问于2010-09-06得票数 0
3回答
我有一个网格，在其中，我需要为不同的列提供不同的背景色。
这些列颜色也不应被mouse-over颜色覆盖。
我试过使用cls和tdCls，但没有成功。
有人能指导如何实现这一目标吗？
提前谢谢。
浏览 6提问于2011-09-16得票数 7
回答已采纳
1回答
我有一个网格，其中有一些列被设置为隐藏。但是，如果我单击列标题并打开菜单框，它会显示列部分中的所有列。它还包括在网格本身中设置为隐藏的那些列。我的问题是如何将这些列也从列表中删除？
浏览 17提问于2019-10-21得票数 2
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
实时音视频
即时通信 IM活动推荐
腾讯云开发者
