修改某一列的背景颜色和字体颜色
css代码
.x-grid-back-red {
background: #FF0000; //修改背景颜色
color:#000000; //修改字体颜色
}
JS代码
{
header : '分成类型',
dataIndex : 'divideType',
renderer : function(v,m){
m.css='x-grid-back-red';
return v;
},
width : 60
}
或者直接这样
{
header : '编号',
dataIndex : 'fcId',
css : 'background: #FF0000;color:#000000',
width : 40
}
修改某一行的背景颜色和字体颜色
css代码
.x-grid-record-red {
background: #FF0000; //修改背景颜色
color:#000000; //修改字体颜色
}
JS代码
直接在grid中设置viewConfig属性
viewConfig : {
forceFit :true,
getRowClass : function(record,rowIndex,rowParams,store){
//禁用数据显示红色
if(record.data.limitType=='1' && record.data.isLeaf=='N'){
return 'x-grid-record-red';
}else{
return '';
}
}
}
或者为grid添加load方法
grid.getStore().on('load',function(s,records){
var girdcount=0;
s.each(function(r){
if(r.get('10')=='数据错误'){
grid.getView().getRow(girdcount).style.backgroundColor='#F7FE2E';
}
girdcount=girdcount+1;
});
});
分享到:
相关推荐
在提供的实例源码中,我们看到的是如何在 EXTJS 中修改颜色的示例,具体涉及到 EXTJS 的 FormPanel 和 ComboBox 组件,以及自定义事件处理。 1. **FormPanel**: - `Ext.form.FormPanel` 是 EXTJS 中用于创建表单...
### Extjs4.2 根据不同的数值设置 TabPanel 行的背景颜色 #### 一、引言 在Web应用程序开发中,为了提高用户体验并使数据呈现更加直观易懂,开发者常常需要根据数据的不同状态来调整UI元素的样式。例如,在使用...
5. 使用CSS来定义不同的背景颜色类,以便在EXTJS中应用。 结论 EXTJS提供了强大的grid功能,可以实现复杂的数据展示和编辑。通过使用renderer函数和getRowClass函数,我们可以轻松实现单元格变色和行变色,从而...
EXTJS 行列转换是一种在前端使用EXTJS框架来实现数据展示的方式,它涉及到了动态Grid的构建,尤其是处理从数据库获取的结构化数据,并在前端以表格的形式进行展示。在EXTJS中,Grid组件是用于展示大量数据的常用工具...
在EXTJS 应用中,颜色选择器提供了用户友好的界面,使得用户能够方便地从预设的颜色列表中选取所需的颜色,或者输入自定义的颜色代码。 在EXTJS 中,ColorField 组件通常用于创建表单字段,允许用户选择颜色。它的...
Extjs4.2 设置tabpanel当前活动页签的样式 Extjs是一个流行的JavaScript框架,用于构建丰富互联网应用程序(RIA)。其中,tabpanel是Extjs中一个常用的控件,用于显示多个面板。设置tabpanel当前活动页签的样式是...
在"Extjs4 拾色器 颜色选择 ColorPicker"的项目中,你可以通过简单地修改index文件中的ExtJS库引用路径,然后双击index.html来快速预览颜色选择器的效果。这表明该项目提供了一个快速启动的示例,让你能够轻松地了解...
以下就是EXTJS Grid设置某列背景颜色和字体颜色的方法。 1. **设置列背景颜色**: 我们可以通过`renderer`函数来实现这一功能。`renderer`是一个在数据渲染到单元格之前被调用的回调函数,它允许我们对数据显示...
根据给定的信息,我们可以深入探讨如何在ExtJS中设置图表的颜色以及其他相关配置。ExtJS是一个用JavaScript编写的库,主要用于构建交互式的Web应用程序。它提供了丰富的UI组件、强大的数据处理功能以及灵活的主题...
在ExtJS中,颜色选择器(Color Picker)是一个常见的组件,用于让用户在多种颜色中选择一种。本实例中的"Extjs颜色选择器"提供了一个完整的实现,方便开发者直接在项目中使用。 在描述中提到的"ColorField.html"...
本实例将帮助初学者了解如何使用ExtJS入门,并通过提供的资源文件学习如何改变文件的颜色。 首先,我们要明白在ExtJS中改变文件颜色主要涉及到CSS样式和组件的配置。ExtJS的组件如按钮、表格、面板等都可以通过CSS...
在EXTJS中,改变表格的颜色是一项常见的需求,用于提高数据可视化效果或突出显示特定的数据。在给定的信息中,我们看到两种方法来实现这个功能:一种是根据单元格的值来改变颜色,另一种是根据行的特定条件来改变...
在本篇内容中,我们将详细探讨如何通过ExtJS框架来修改Grid中行或列的颜色,以便于实现更直观的数据展示效果。此方法适用于需要对数据进行视觉区分的应用场景,例如:高亮显示某些特定行或列,使得用户能够快速识别...
综上所述,EXTJS Grid提供了丰富的灵活性来定制数据的显示,包括改变列和行的背景色及字体颜色。通过使用`renderer`函数和`getRowClass`方法,我们可以根据业务需求动态地调整Grid的视觉样式,提升用户体验。在实际...
在“extjs最简单的数据绑定和修改”这个主题中,我们将探讨如何在ExtJS中实现数据的双向绑定以及如何进行数据的修改。 1. 数据模型(Model): 在ExtJS中,数据模型定义了数据对象的结构和属性。创建一个模型类,...
ExtJS3 升级到 ExtJS4 需要修改大量代码,主要是因为 ExtJS4 配备了一类新的系统,不向后兼容。在 ExtJS 3 里生成表的几个框架组件,ExtJS4 大多生成 div,这使得 CSS classes 将会失败。ExtJS4 已完全重新写 grid ...
总结起来,"ExtJS颜色选择器(modern版)"是ExtJS6.0+框架中针对现代设备优化的颜色选择组件,它提供了丰富的功能和高度的可定制性,帮助开发者在Web应用中轻松集成颜色选择功能。通过深入理解和灵活运用,开发者...
extjs4.1修改bug版本,已修改数字、日期等多个控件的问题
EXTJS 样式 extjs字体大小 可以轻松在这个CSS文件里面调整EXTJS插件的字体大小,对这个有需求的同志们有福了!