当前位置: 首页 > 图文教程 > 网络编程 > Javascript > 学习ExtJS Panel常用方法

Javascript
javascript 动态数据下的锚点错位问题解决方法
jQuery 动画基础教程
jQuery 操作XML入门
ASP SQL防注入的方法
jquery 插件 web2.0分格的分页脚本,可用于ajax无刷新分页
jquery 插件 任意位置浮动固定层
JavaScript 检测浏览器和操作系统的脚本
不要小看注释掉的JS 引起的安全问题
js实现的验证,学习用js控制td
javascript iframe中打开文件,并检测iframe存在否
Javascript typeof 用法
Javascript valueOf 使用方法
extjs form textfield的隐藏方法
extjs grid取到数据而不显示的解决
Ext第一周 史上最强学习笔记---GridPanel(基础篇)
My Desktop :) 桌面式代码
javascript 双击文本框编辑功能代码
不用写JS也能使用EXTJS视频演示
js 提取class相同的节点集合
js Li来实现的效果

Javascript 中的 学习ExtJS Panel常用方法


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-10-10   浏览: 458 ::
收藏到网摘: n/a

ExtJS Panel常用方法,需要的朋友可以参考下。 一、属性
frame:布尔类型true 或 false ,为true时表示边框为圆角且具有背景色,取false则反之。
xtype:在EXTJS的可视化组件部署中的一种机制,即通过指定xtype的值,来告诉容量如何初始化所包含的级件,如xtype:"textfiled",表示使用Ext.form.TextFile来进行初始化当前组件。
xtype Class
------------- ------------------
box Ext.BoxComponent
button Ext.Button
buttongroup Ext.ButtonGroup
colorpalette Ext.ColorPalette
component Ext.Component
container Ext.Container
cycle Ext.CycleButton
dataview Ext.DataView
datepicker Ext.DatePicker
editor Ext.Editor
editorgrid Ext.grid.EditorGridPanel
flash Ext.FlashComponent
grid Ext.grid.GridPanel
listview Ext.ListView
panel Ext.Panel
progress Ext.ProgressBar
propertygrid Ext.grid.PropertyGrid
slider Ext.Slider
spacer Ext.Spacer
splitbutton Ext.SplitButton
tabpanel Ext.TabPanel
treepanel Ext.tree.TreePanel
viewport Ext.ViewPort
window Ext.Window
Toolbar components
---------------------------------------
paging Ext.PagingToolbar
toolbar Ext.Toolbar
tbbutton Ext.Toolbar.Button (deprecated; use button)
tbfill Ext.Toolbar.Fill
tbitem Ext.Toolbar.Item
tbseparator Ext.Toolbar.Separator
tbspacer Ext.Toolbar.Spacer
tbsplit Ext.Toolbar.SplitButton (deprecated; use splitbutton)
tbtext Ext.Toolbar.TextItem
Menu components
---------------------------------------
menu Ext.menu.Menu
colormenu Ext.menu.ColorMenu
datemenu Ext.menu.DateMenu
menubaseitem Ext.menu.BaseItem
menucheckitem Ext.menu.CheckItem
menuitem Ext.menu.Item
menuseparator Ext.menu.Separator
menutextitem Ext.menu.TextItem
Form components
---------------------------------------
form Ext.FormPanel
checkbox Ext.form.Checkbox
checkboxgroup Ext.form.CheckboxGroup
combo Ext.form.ComboBox
datefield Ext.form.DateField
displayfield Ext.form.DisplayField
field Ext.form.Field
fieldset Ext.form.FieldSet
hidden Ext.form.Hidden
htmleditor Ext.form.HtmlEditor
label Ext.form.Label
numberfield Ext.form.NumberField
radio Ext.form.Radio
radiogroup Ext.form.RadioGroup
textarea Ext.form.TextArea
textfield Ext.form.TextField
timefield Ext.form.TimeField
trigger Ext.form.TriggerField
Chart components
---------------------------------------
chart Ext.chart.Chart
barchart Ext.chart.BarChart
cartesianchart Ext.chart.CartesianChart
columnchart Ext.chart.ColumnChart
linechart Ext.chart.LineChart
piechart Ext.chart.PieChart
Store xtypes
---------------------------------------
arraystore Ext.data.ArrayStore
directstore Ext.data.DirectStore
groupingstore Ext.data.GroupingStore
jsonstore Ext.data.JsonStore
simplestore Ext.data.SimpleStore (deprecated; use arraystore)
store Ext.data.Store
xmlstore Ext.data.XmlStore
defaults:xtypes的默认值,如:
 defaults:{xtype:"textfield",width:180},
 items:[{fieldLabel:"帐号"},{fieldLabel:"密码"}],

二、方法
add(Ext.Component/Object_component):添加一个组件到面板中,运行时方法。
addButton( String/Object config, Function handler, Object scope ) :添加一个按钮到面板中,设计时方法(对象在未构造之前调用)。
_panel.addButton({text:"确 定"}); //form按默认宽度自适应创建
_panel.addButton(new Ext.Button({text:"取消",minWidth:200}));


三、事件
render:当前对象被构造后触发(设计时事件)。
renderto(构造参数):将当前对象所生成的HTML对象存放在指定的对象中(运时时事件)。
两者不能同进使用,否则render不起作用。

三、构造参数
items:指定包含在面板中组件的配置数组如textField。
buttons:指定包含面板中按钮的配置数组。
四、应用举例
Ext.onReady(function(){
var _panel
= new Ext.Panel({
title:
"人员信息",
frame:
true,
width:
400,
height:
300
})
_panel.addButton({text:
"确定"});
_panel.addButton(
new Ext.Button({text:"取消",minWidth:200}));
_panel.render(Ext.getBody());
}) ;
Ext.onReady(function(){
var _panel
=new Ext.Panel({
title:
"登陆",
renderTo:Ext.getBody(),
frame:
true,
width:
560,
height:
130,
layout:
"form",
lableWidth:
45,
defaults:{xtype:
"textfield",width:180},
items:[{fieldLabel:
"帐号"},{fieldLabel:"密码"}],
buttons:[{text:
"确定"},{text:"取消"}]
})
})