代码简单 只是记录一下
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gbk">
<title>03.grid</title>
<link rel="stylesheet" type="text/css" href="../../resources/css/ext-all.css" />
<script type="text/javascript" src="../../adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="../../ext-all.js"></script>
<script type="text/javascript">
Ext.onReady(function(){
Ext.QuickTips.init();
var cm = new Ext.grid.ColumnModel([
{header:'编号',dataIndex:'id',width:35},
{header:'名称',dataIndex:'name',width:50},
{id:'descn',header:'描述',dataIndex:'descn',width:200,renderer:function(value){
return "<div ext:qtip='<img src=\""+value+"\" width=100 hight=100/>'>"+value+"</div>";
}}
]);
var data = [
['1','name1','14-01.png'],
['2','name2','14-01.png'],
['3','name3','14-01.png'],
['4','name4','14-01.png'],
['5','name5','14-01.png']
];
var store = new Ext.data.Store({
proxy: new Ext.data.MemoryProxy(data),
reader: new Ext.data.ArrayReader({}, [
{name: 'id'},
{name: 'name'},
{name: 'descn'}
])
});
store.load();
var grid = new Ext.grid.GridPanel({
autoHeight: true,
renderTo: 'grid',
store: store,
cm: cm
});
});
</script>
</head>
<body>
<div id="grid"></div>
</body>
</html>
- 大小: 10.9 KB
分享到：
相关推荐
根据提供的文件信息，我们可以深入探讨如何在 Ext JS 中实现 Grid 的单元格合并功能。此案例主要涉及到了自定义 GridView 的 `renderHeaders` 方法来达到单元格合并的目的，并且还涉及了模板（Template）的使用、...
首先，我们要了解Ext JS中的Grid Panel是实现合并单元格的主要组件。Grid Panel是一个用于显示大量结构化数据的灵活控件，通过使用Store来存储数据，ColumnModel来定义列的布局和格式。 1. **合并策略**：在Ext JS...
1. **理解EXT Grid的结构**：EXT Grid由一系列的行（Row）和列（Column）组成，每一行包含多个单元格（Cell）。行合并涉及将多个行的单元格合并为一个大单元格。 2. **自定义Renderer**：首先，我们需要创建一个...
### ext表格合并单元格的方法 #### 背景与概述 在进行Web开发时，特别是在使用Ext JS框架处理表格数据展示的过程中，经常会遇到需要合并单元格的情况。这不仅可以提升数据展示的美观性，还能增强数据的可读性和...
解决 ExtJS GridPanel 单元格无法选中复制的问题需要两个步骤：添加新的 CSS 样式和修改 Ext.grid.GridPanel 的 prototype。通过这些步骤，我们可以使得单元格的内容可以被选中和复制，从而提高用户体验。
在实际开发中，我们有时需要在Grid的单元格（Cell）中添加更丰富的交互元素，例如输入框、下拉选择器等，这时就涉及到了`Ext Grid CellEdit`的概念。`CellEdit`允许我们在单个单元格中进行编辑，而不是整个行，提高...
5. **编辑功能**：EXTGRID可以配置为行编辑或单元格编辑模式，方便用户直接在网格中添加、修改和删除数据。 6. **扩展性**：EXTGRID支持各种插件和扩展，如工具栏、分组视图、拖放功能、树形网格等，增强功能和交互...
"Ext的用户扩展控件-----可以在表格的单元格上弹出提示层信息"是一个专门为EXT的Grid组件设计的功能增强插件，它使得用户在鼠标悬停于表格的特定单元格时，能够显示更详细的信息提示，极大地提升了数据展示的交互性...
在EXT GridPanel中，获取某一单元格的值是常见的操作，特别是在实现自定义事件处理或数据验证时。 在提供的代码段中，我们看到一个监听`cellclick`事件的例子，这是EXT GridPanel中用于捕获用户点击单元格时的事件...
在EXT JS这个强大的JavaScript框架中，Grid组件是用于展示大量结构化数据的核心组件。"ext grid 显示数据"这一主题，是深入理解EXT JS开发的关键知识点之一，特别是在处理表格和列表展示时。在"LearningExtJS 第五...
EXT Grid是一款基于JavaScript的强大的...在实际开发中，EXT Grid导出Excel的功能可以根据项目需求进行定制，例如添加自定义样式、合并单元格、设置条件格式等。理解上述步骤后，你可以根据具体需求进行扩展和优化。
标题"ext超酷的grid中放图片(ext3.2.1)"暗示了我们将探讨如何在EXT JS的Grid组件中嵌入和展示图片。EXT JS 3.2.1虽然已经是较旧的版本，但其核心概念和方法在后续版本中仍然适用，因此学习这部分内容对于理解EXT JS...
- 处理样式和格式：EXT Grid的样式无法直接应用于Excel，所以你可能需要在构建Excel文件时指定单元格的样式。 - 处理大数据量：如果数据量过大，可能需要分批导出或者使用服务器端处理。 - 支持国际化：考虑不同语言...
Ext4 Grid打印是基于Ext JS库的一个功能，用于在网页中展示数据的表格组件。Ext4 Grid提供了丰富的功能，包括数据排序、筛选、分页以及列的动态调整等。在这个场景下，"grid打印"指的是将Grid中的数据导出或者可视化...
在处理大数据集时，Grid往往会出现纵向滚动条，以方便用户浏览表格内容。当数据行数非常多时，用户可能希望自定义滚动条的滚动量，即单次滚动鼠标滚轮时，Grid表格移动的行数。这涉及到对Grid Panel的滚动行为进行...
在IT行业中，Ext Grid是一款广泛使用的JavaScript组件，它允许开发者创建功能丰富的数据表格。这篇博客“Ext Grid导出Excel”探讨的主题是如何将Ext Grid中的数据显示在Microsoft Excel文件中，这在数据分析、报告...
7. **插件支持**：EXT JS Grid有多种插件，如CellEditing用于单元格编辑，RowExpander用于行展开显示更多信息，RowBody用于在行内显示额外内容。 8. **响应式设计**：EXT JS的Grid支持响应式布局，自动适应不同屏幕...
**jq-extgrid表格插件详解** jq-extgrid是一款基于jQuery的强大的表格插件，它极大地扩展了基础的jQuery grid功能，提供了丰富的特性以满足复杂的表格展示需求。在Web开发中，尤其是在数据展示和操作上，jq-extgrid...
在Ext JS这个强大的JavaScript框架中，开发人员经常需要创建数据展示组件，比如Grid，来显示大量数据并提供交互性。Grid List是Grid的一种扩展，它不仅具有基本的表格功能，还可以进行更复杂的操作。本教程将详细...