`
babydeed
  • 浏览: 235579 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

ext grid 单元格提示 出现图片

    博客分类:
  • Ext
阅读更多

代码简单 只是记录一下

 

  <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 grid合并单元格

    MyGridView=Ext.extend(Ext.grid.GridView,{ renderHeaders : function(){ var cm = this.cm, ts = this.templates; var ct = ts.hcell,ct2=ts.mhcell; var cb = [], sb = [], p = {},mcb=[]; for(var i = 0...

    ext grid 合并行

    本人成功实现的一个合并列的例子,希望对大家有帮助

    EXT GridPanel获取某一单元格的值

    EXT GridPanel获取某一单元格的值

    Ext自定义Grid Cell插件

    Ext自定义Grid Cell插件,使用此插件可以在Grid空间的Cell单元格中插入指定的控件

    Ext的用户扩展控件-----可以在表格的单元格上弹出提示层信息

    下载后放入ext的example文件夹中可以直接运行

    ExtJS 4.2 Grid组件单元格合并的方法

    ExtJS 4.2 Grid组件本身并没有提供单元格合并功能,需要自己实现这个功能。 目录 1. 原理 2. 多列合并 3. 代码与在线演示 1. 原理 1.1 HTML代码分析 首先创建一个Grid组件,然后查看下的HTML源码。 1.1.1 Grid组件 ...

    JavaScript中使用sencha gridpanel 编辑单元格、改变单元格颜色

    表格的列信息由类Ext.grid.Column(以前是由Ext.grid.ColumnModel定义)、而表格的数据存储器由Ext.data.Store定义,数据存储器根据解析的数据不同分为JsonStore、SimpleStroe、GroupingStore等。 下面

    Ext扩展控件,可以用图片显示百分之多少

    EXT的扩展控件,支持表格中有百分数的单元格以图片显示成进度条的形式

    GridPanel中的单元格不能选中复制的解决方法

    Ext.grid.GridPanel有一个重大缺陷,就是单元格的内容不能选中,没法选中就没法复制,给用户带来很多不便,下面是从网上搜到的解决方案。

    ExtJS4 Grid改变单元格背景颜色及Column render学习

    利用的是Column的render实现单元格背景颜色改变,本文给予了实现代码,感兴趣的朋友可以了解下,或许对你学习ExtJS4 Grid有所帮助

    Extjs4 Grid Row 事件

    Extjs 4.0 mvc 模式下开发添加Grid 的 单元格事件

    ExtJs动态grid的生成

    NULL 博文链接:https://dejazhan.iteye.com/blog/871259

    Ext Js权威指南(.zip.001

    Ex4.0共2个压缩包特性,《ext js权威指南》 ...10.3.4 数据汇总功能:ext.grid.featrue.abstractsummary与ext.grid.featrue. summary / 539 10.3.5 分组功能:ext.grid.featrue.grouping / 543 10.3.6 分组汇总...

    extjs 04_grid 单击事件新发现

    EXTJS GRID 中 单击行和单元格获得行或者单元格的内容(数据) Js代码 代码如下: grid.addListener(‘cellclick’,cellclick); function cellclick(grid, rowIndex, columnIndex, e) { var record = grid.getStore()....

    Ext 开发指南 学习资料

    2.5. 让单元格里显示红色的字,图片,按钮,你还能想到什么? 2.6. 更进一步,自动行号和多选checkbox 2.6.1. 自动行号 2.6.2. 全选checkbox的时间了,请允许我让2.0先上场。 2.7. 分页了吗?分页了吗?如果还没分就...

    Ext js 教程大全

    再加上可编辑grid,添加新行,删除一或多行,提示脏数据,推拽改变grid大小,grid之间拖拽一或多行,甚至可以在tree和grid之间进行拖拽,啊,这些功能实在太神奇了。更令人惊叹的是,这些功能竟然都在ext表格控件里...

    ext.net-extjs

    再加上可编辑grid,添加新行,删除一或多行,提示多行数据,拖拽改变grid大小,grid之间拖拽一或多行,甚至可以在tree和grid之间进行拖拽,啊,这些功能实在太神奇了。更令人惊叹的是,这些功能竟然都在ext表格控件...

    EXT2.0中文教程

    2.5. 让单元格里显示红色的字,图片,按钮,你还能想到什么? 2.6. 更进一步,自动行号和多选checkbox 2.6.1. 自动行号 2.6.2. 全选checkbox的时间了,请允许我让2.0先上场。 2.6.3. 1.x时代的全选checkbox。 2.7. ...

    ExtJS Grid功能实现

    ExtJS 表格的功能实现,包括单元格编辑,数据的获取。

Global site tag (gtag.js) - Google Analytics