checkbox大家都应该用过,在ext中,有时候checkbox的boxlabel显示的内容一般比较短,所以鼠标悬浮提示的功能有时候是比不可少的,由于ext的事件机制,开始时候使用ext.on,addlistener方法利用mouseover事件来做不过好像没起作用(如果有谁利用mouseover实现请共享一下代码,谢谢),于是发现了一个办法,就是在checkbox的boxlabel中加上标签
boxLabel : '<span ext:qtip="aaa">aaa</span>',
这样借助于ext的qtip轻松实现了checkbox的鼠标悬浮提示的功能。
详细代码如下:
Ext.onReady(function() {
Ext.QuickTips.init();
var indexconfigForm = new Ext.FormPanel({
renderTo : document.body,
title : 'RadioGroup',
frame : true,
width : 250,
labelWidth : 50,
labelAlign : 'top',
margins : '0 0 5 0',
bodyStyle : 'padding:5px 5px 5px 5px',
autoScroll : true,
items : [{
xtype : 'fieldset',
title : 'fieldset1',
autoHeight : true,
autoWidth : true,
layout : 'form',
cls : 'my-fieldset',
items : [{
id : 'szwlcheckboxgroup',
xtype : 'checkboxgroup',
fieldLabel : 'checkboxgroup1',
columns : 2,
items : [{
boxLabel : '<span ext:qtip="aaa">aaa</span>',
name : 'Tempw',
width : '100%'
}, {
boxLabel : '<span ext:qtip="bbb">bbb</span>',
name : 'Temps',
width : '100%'
}, {
boxLabel : '<span ext:qtip="ccc">ccc</span>',
name : 'conductivity'
}, {
boxLabel : '<span ext:qtip="ddd">ddd</span>',
name : 'iss'
}, {
boxLabel : '<span ext:qtip="eee">eee</span>',
name : 'detritus'
}, {
boxLabel : '<span ext:qtip="fff">fff</span>',
name : 'TSS'
}]
}, {
id : 'szhxcheckboxgroup',
xtype : 'checkboxgroup',
fieldLabel : 'checkboxgroup2',
columns : 2,
items : [{
boxLabel : '<span ext:qtip="AAA">AAA</span>',
name : 'cbods'
}, {
boxLabel : '<span ext:qtip="BBB">BBB</span>',
name : 'cbodf'
}, {
boxLabel : '<span ext:qtip="CCC">CCC</span>',
name : 'cbodu'
}, {
boxLabel : '<span ext:qtip="DDD">DDD</span>',
name : 'alkalinity'
}, {
boxLabel : '<span ext:qtip="EEE">EEE</span>',
name : 'ph'
}, {
boxLabel : '<span ext:qtip="FFF">FFF</span>',
name : 'do'
}, {
boxLabel : '<span ext:qtip="GGG">GGG</span>',
name : 'SODAndSpec'
}]
}]
}]
});
})
运行界面:
注意:
Ext.QuickTips.init();这句代码不可缺少,不然不会出现tip...
- 大小: 7.6 KB
分享到:
相关推荐
Ext_Net_CheckboxGroup 勾选、全选、反选和限制勾选
NULL 博文链接:https://lw671579557.iteye.com/blog/579242
EXTjs2 的treeNode 带有checkbox,可是API中,关于checkbox的事件就只有一个checkchange事件,所以写个方法传上来。
重写 代码如下: //解决checkboxgroup回填数据问题 Ext.override(Ext.form.BasicForm,{ findField : function(id){ var field = this.items.get(id); if(!field){ this.items.each(function(f){ if(f.isXType(...
NULL 博文链接:https://lovebeyond.iteye.com/blog/441009
js 实现 checkbox鼠标移入移出的特效值得下载看看!资源免费,大家分享!!
TreePanel的checkbox节点操作及父子节点联动的演示DEMO
Extjs3.0 中的CheckboxGroup默认不能动态添加item。虽然它继承了Ext.form.Field,但是却类似于容器。 CheckboxGroup配置中的items处理生成一个对应的panel,该处理过程只有一次,所以很难对CheckboxGroup进行动态...
代码如下: Ext.override(Ext.form.CheckboxGroup,{ setValueForItem : function(val){ //多个选项值以逗号分开的 val = “,”+val+”,” this.items.each(function(item) { if (val.indexOf(item.inputValue) > -1) ...
VC checkbox/button等窗体控件元素添加鼠标提示的例子,演示如何在Checkbox和Button上添加文字提示,其实这个是基本的功能,因为复选框和按钮本身就是需要文字说明的,所以本代码高手请转身吧,压缩包内附有测试实例...
CheckBox多选功能的实现 ListView与CheckBox CheckBox多选功能的实现 ListView与CheckBox
jquery 实现鼠标单击行时,改变行的背景颜色,选中checkbox复选框
EXT TREE 扩展CHECKBOX所需JS loader方法中添加: baseAttrs: {uiProvider: Ext.tree.TreeCheckNodeUI }
NULL 博文链接:https://stevelee.iteye.com/blog/1328992
checkbox实现复选框,源代码,动态生成多个checkbox,切换点击实现槽函数,遍历定位哪个按钮
checkbox实例,还有radiobox
简单代码实现android的多选、全选、反选功能。介绍功能实现的全过程以及需要注意的地方。简单代码分享,希望能给大家带来一些帮助!
所以checkbox为false。 比如酷狗音乐中,上下页选中的歌曲不会保留,只能在每页中选择添加后,再切换下页。 但是项目中有着需求,所以只能完成实现。 项目具体的需求如下:给角色授权时,选择模块以及模块下的操作,...
是一个MFC 的checkBox的自绘代码,对初次接触自绘控件的朋友来说应该是很有帮助的。