5.Ext JS actioncolumn动态加载图标/提示

简介: 版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/inforstack/article/details/54237726 ...
版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/inforstack/article/details/54237726

官网介绍

图标加载

getClass : Function  

    A function which returns the CSS class to apply to the icon image.  

    Parameters  
        v : Object  
        The value of the column's configured field (if any).  

        metadata : Object  
        An object in which you may set the following attributes:  

            css : String  
            A CSS class name to add to the cell's TD element.  

            attr : String  
            An HTML attribute definition string to apply to the data container element within the table cell (e.g. 'style="color:red;"').  

        r : Ext.data.Model  
        The Record providing the data.  

        rowIndex : Number  
        The row index.  

        colIndex : Number  
        The column index.  

        store : Ext.data.Store  
        The Store which is providing the data Model.  
AI 代码解读

提示加载

getTip : Function

A function which returns the tooltip string for any row.
Parameters

    v : Object
    The value of the column's configured field (if any).

    metadata : Object
    An object in which you may set the following attributes:

        css : String
        A CSS class name to add to the cell's TD element.

        attr : String
        An HTML attribute definition string to apply to the data container element within the table cell (e.g. 'style="color:red;"').

    r : Ext.data.Model
    The Record providing the data.

    rowIndex : Number
    The row index.

    colIndex : Number
    The column index.

    store : Ext.data.Store
    The Store which is providing the data Model.
AI 代码解读


项目实战

text : "操作",
xtype:'actioncolumn',
sortable : false,
width : 190,
items : [{
	handler : "projectFavorite",
	name : 'projectFavorite',
	getClass : function (v, metadata, r, rowIndex, colIndex, store) {
		if (me.userType == '20') {
			if (r.data.partaked){ 
				return "x-item-disabled x-fa fa-heart";
			} else {
				return r.data.favorite == true ? "x-fa fa-heart" : "x-fa fa-heart-o";
			}
		}
	},
	getTip : function (v, metadata, r, rowIndex, colIndex, store) {
		if (me.userType == '20') {
			return r.data.favorite == true ? "取消关注" : "关注";
		}
	}
}]
AI 代码解读


目录
打赏
0
0
0
0
1
分享
相关文章
JS动态加载以及JavaScript void(0)的爬虫解决方案
Intro 对于使用JS动态加载, 或者将下一页地址隐藏为JavaScript void(0)的网站, 如何爬取我们要的信息呢? 本文以Chrome浏览器为工具, 36Kr为示例网站, 使用 Json Handle 作为辅助信息解析工具, 演示如何抓取此类网站.
6647 0
利用Selenium和XPath抓取JavaScript动态加载内容的实践案例
利用Selenium和XPath抓取JavaScript动态加载内容的实践案例
动态加载与异步加载 JavaScript 详解:加载远程js,加载成功后执行回调函数
动态加载与异步加载 JavaScript 详解:加载远程js,加载成功后执行回调函数
1649 2
js实用方法记录-动态加载css/js
js实用方法记录-动态加载css/js
63 0
MooTools、Backbone、Sammy、Cappuccino、Knockout、JavaScript MVC、Google Web Toolkit、Google Closure、Ember、Batman 以及 Ext JS。
MooTools、Backbone、Sammy、Cappuccino、Knockout、JavaScript MVC、Google Web Toolkit、Google Closure、Ember、Batman 和 Ext JS 都是 JavaScript 框架,用于开发 Web 应用程序。它们分别提供了不同的功能和特性,以帮助开发者更高效地构建和维护 Web 应用程序。
71 2
BootStrap框架下使用JS动态加载table并点击相关列弹出二级页面
在这里记录一下,也是在公司用到的一个例子,刚刚解决,正好趁热打铁。前端页面是采用BootStrap框架搭建的,主要的样式涉及到项目,在这里就不截图了,直接上代码:
137 1
如何采集javascript动态加载网页
从一个运行 javascript 的网站加载所有数据来加载内容,目前的问题是当运行启动代码时它无法加载 javascript 内容,因为用户应该向下滚动才能加载。如何编写启动代码来滚动整页呈现 javacript 并返回 html呢? 为了加载运行JavaScript来加载内容的网站上的所有数据,可以修改Splash代码以模拟滚动并确保整个页面呈现,从而能够检索所需的HTML内容
103 0

热门文章

最新文章