EXT各个控件属性6Word文档下载推荐.docx
- 文档编号:19304247
- 上传时间:2023-01-05
- 格式:DOCX
- 页数:29
- 大小:27.71KB
EXT各个控件属性6Word文档下载推荐.docx
《EXT各个控件属性6Word文档下载推荐.docx》由会员分享,可在线阅读,更多相关《EXT各个控件属性6Word文档下载推荐.docx(29页珍藏版)》请在冰豆网上搜索。
varData_1001=Ext.data.Record.create([
]);
vara=SmRegulartree.getSelections();
Ext.each(a,function(item,index,allItems){
varfoundItem=Regular_store.find('
item.data.name);
if(foundItem
==-1){
Regular_store.add(newData_1001({Regular_name:
item.data['
name'
]}));
}
});
3.全选反选取消
bbar:
[{
text:
'
全选'
handler:
function(){
varcount=Regular_store.getCount();
if(count>
0){
vara=newArray();
for(vari=0;
i<
count;
i++){
a[i]=i;
regularg1.getSelectionModel().selectRows(a);
},'
-'
{
反选'
vartrims="
"
;
varstr="
varid="
a[i]=Regular_store.data.items[i].id+"
-"
+i;
}
varlist2=regularg1.selModel.getSelections();
for(vark=0;
k<
a.length;
k++){
str=a[k].split("
);
for(varj=0;
j<
list2.length;
j++){
id=list2[j].id.split("
if(str[2]==id[2]){
break;
if(j<
list2.length){
continue;
if(trims!
='
){
trims+='
'
trims+=k.toString();
regularg1.getSelectionModel().selectRows(trims);
//Ext.MessageBox.alert('
提示'
result);
取消'
regularg1.getSelectionModel().clearSelections();
}]
grid表格的操作
行选择模式:
Js代码
varrowcount=grid.getSelectionNode().getSelections();
可以获取全部选中的记录,得到的rowcount将是一个Array,比如想获取sex列的数据,语句如下
varstrsex=rowcount[i].get(‘sex’);
单元格选择模式
如果在GridPanel的配置属性增加sm属性如下
sm:
newExt.grid.CellSelectionModel();
则表格的选择模式为单元格选择模式。
当单击时将选中对应的某一个单元格,而不是默认的选择某一行。
选择方式如下
varcell=grid.getSelectionNode().getSelectedCell();
得到的cell记录了当前选择的行(cell[0])以及列(cell[1]).可以通过一下语句得到该单元格数据
varcolname=grid.getColumnModel().getDataIndex(cell[1]);
//获取列名
varcelldata=grid.getStore().getAt(cell[0]).get(colname);
//获取数据
//获取列名
//获取数据
getStore():
获取表格的数据集
getAt():
获取该数据集cell[0]行
get():
获取该行colname的数据
2)为表格增加链接
有时我们需要为表格中的某一列添加一个链接。
可以利用renderer配置属性为该列添加html
如下:
{id:
3'
header:
名称'
dataIndex:
renderer:
DomUrl},
定义DomUrl方法
functionDomUrl(value){
return"
<
ahref=>
+value+"
/a>
}
functionDomUrl(value){
}
如果表格内的数据是一个链接如:
这样写法自然没有问题,但是大多数时候我们在表格中不会直接写一个链接,如果又需要根据单元格内容动态为链接添加几个参数。
那这种写法就几乎没有什么用了。
因为这个属性是在表格初始化的时候定义好的,而且表格初始化之后这个属性无法改变,也就是只读属性。
处理方法如下:
定义一个全局变量,初始值为0;
DomUrl函数如下
varrow=grid.getSelectionModel().selectRow(startrow);
//选中当前行
varrownum=grid.getSelectionModel().getSelected();
//获取当前行
startrow++;
varstrurl="
abc.jsp?
id="
+rownum.get('
id'
//获取当前选中行的值,并组织链接字符串
ahref='
+strurl+"
>
//选中当前行
//获取当前行
//获取当前选中行的值,并组织链接字符串
不过不要忘记在下次提交的时候将startrow赋值为0。
3)表格的属性
表格的属性分为配置属性(在操作表格时无法修改),以及其他可读写属性,方法,以及事件。
配置属性
a)activeItem:
渲染布局时激活的子元素。
b)applyTo:
指定渲染对象。
c)autoDestroy:
当容器的子元素从容器中移除时是否自动销毁。
d)autoExpandColumn:
指定自动填充表格剩余区域的列id
e)autoExpandMax:
可自动扩张的最大宽度。
f)autoExpandMin:
可自动扩张的最小宽度
g)autoHeight:
自动扩充高度
h)autoShow:
是否自动显示
i)autoWidth:
自动扩充宽度
j)bbar/tbar:
底部/顶部状态栏
k)bufferResize:
容器再布局的缓冲频率
l)colModel/cm:
列模式
m)cls:
组件的额外css格式。
n)collapsible:
是否显示快捷隐藏按钮
o)defaults:
指定默认配置。
p)disableSelection:
是否禁止选择表格行或列
q)enableDragDrop:
是否允许表格列的拖放操作。
r)enableHdMenu:
是否显示表格列的菜单。
s)frame:
边框是否显示
t)loadMask:
是否显示加载动画
u)selModel/sm:
表格选择模式
v)store:
表格数据集
w)stripeRows:
是否显示分隔线。
x)title:
表格标题
方法
a)getColumnModel():
得到表格列模型
b)getGridEl():
得到表格下的元素
c)getPosition():
得到组件的当前位置,返回一个数组
d)getSelectionModel():
得到选中模型
e)getSize():
得到组件大小
f)getStore():
得到组件的数据集
g)getView():
得到表格的GridView对象。
h)hide():
隐藏当前组件
i)isVisible():
判断当前组件是否显示
j)setDisabled(Boolean):
设置组件的可用性
k)un():
解除组件的监听
l)on():
为组件添加监听
on(StringeventName,Functionhandler,[Objectscope])
eventName:
添加监听的名称
handler:
事件处理函数
scope:
事件响应的作用域,包括scope,delay,single,buffer。
布局嵌套横向摆放组件
Ext.onReady(function(){
Ext.QuickTips.init();
//初始化提示信息
varsimple=newExt.FormPanel({
//xtype:
"
form"
renderTo:
div'
id:
form'
//title:
测试'
labelWidth:
55,
align:
center"
//style:
margin:
10auto;
align:
center'
width:
850,
height:
320,
//border:
false,
//不显示边框
//定义表单元素
items:
xtype:
panel'
layout:
table'
frame:
false,
//渲染面板
defaults:
{
//设置默认属性
bodyStyle:
borderColor:
#FFFFFF'
//设置面板体的背景色
},
border:
false,
items:
xtype:
[{
fieldLabel:
待处理'
userId'
name:
//元素名
allowBlank:
//不允许为空
textarea'
300,
200
},
{
结果集'
username'
}],
buttons:
执行'
type:
submit'
varname=$('
#userId'
).val();
Ext.MessageBox.alert('
name);
//取值方式一
if(simple.form.isValid()){
varuserId=Ext.getCmp("
userId"
).getValue().toUpperCase();
//取值方式二
Ext.getCmp('
).setValue(userId);
//赋值
},{
重置'
simple.form.reset();
//重置表单
varformPanel=newExt.form.FormPanel({
layout:
//可不写,默认
div1'
//border:
false,
800,
200,
column'
border:
items
:
[
columnWidth:
.3,
[{fieldLabel:
xtype:
textfield'
},{fieldLabel:
}]
},
- 配套讲稿:
如PPT文件的首页显示word图标,表示该PPT已包含配套word讲稿。双击word图标可打开word文档。
- 特殊限制:
部分文档作品中含有的国旗、国徽等图片,仅作为作品整体效果示例展示,禁止商用。设计者仅对作品中独创性部分享有著作权。
- 关 键 词:
- EXT 各个 控件 属性