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

Javascript
关于setEndPoint msdn给出的参考
一个不用onmouseup的拖动函数
实现163邮箱的图标功能
javascript 也来玩玩图片预加载
又一个小巧的图片预加载类
使用正则替换变量
JS统计Flash被网友点击过的代码
JS脚本混淆、加密讨论
通过Unicode转义序列来加密,按你说的可以算是混淆吧
javascript之ESC(第二类混淆)
另一种希望别人无法修改js的代码
javascript又一解密过程,推荐的,会这个基本上好多都能解决了
ESC之ESC.wsf可以实现javascript的代码压缩附使用方法
javascript支持区号输入的省市二级联动下拉菜单
一个不错的渐显菜单
javascript之水平横向滚动歌词同步的应用
javascript实现表现、结构、行为分离的选项卡效果!
[全兼容哦]--实用、简洁、炫酷的页面转入效果loing
用js判断浏览器是否是IE的比较好的办法
延时重复执行函数 lLoopRun.js

Javascript 中的 学习ExtJS Panel常用方法


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-10-10   浏览: 519 ::
收藏到网摘: 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:"取消"}]
})
})