`
raymond.chen
  • 浏览: 1416737 次
  • 性别: Icon_minigender_1
  • 来自: 广州
社区版块
存档分类
最新评论

Ext.Viewport

阅读更多

Ext.Viewport代表浏览器窗口的整个显示区域,将document body作为渲染对象,它会根据浏览器窗口的大小自动调整自身的尺寸。
 在一个页面中只允许出现一个Viewport实例,没有提供对滚动条的支持。

 

Ext.onReady(function(){
	var accordion = new Ext.Panel({
		title: "功能分组",
		layout: "accordion",
		layoutConfig: {
			animate: true
		},
		width: 250,
		minWidth: 100,
		region: "west",
		split: false,
		collapsible: true,
		items: [
			{title:"嵌套面板一", html:"嵌套面板一", iconCls:"save"},
			{title:"嵌套面板二", html:"嵌套面板二", iconCls:"search"},
			{title:"嵌套面板三", html:"嵌套面板三", iconCls:"back"}
		]
	});
	
	new Ext.Viewport({
		title: "Viewport",
		layout: "border",
		defaults: {
			bodyStyle: "background-color: #FFFFFF;",
			frame: true
		},
		items: [
			accordion,
			{region:"north", height:100},
			{region:"center"}
		]
	});
});

 

 

  • 大小: 23.4 KB
分享到:
评论
2 楼 zzg16 2011-09-21  
lingfenfei 写道
items: [  
14.            {title:"嵌套面板一", html:"嵌套面板一", iconCls:"save"},  
15.            {title:"嵌套面板二", html:"嵌套面板二", iconCls:"search"},  
16.            {title:"嵌套面板三", html:"嵌套面板三", iconCls:"back"}  
17.        ]

请问如何让这些成为动态的




可以请求一个servlet,servlet生成JSON数据,然后用JS处理JSON数据即可.
1 楼 lingfenfei 2011-01-14  
items: [  
14.            {title:"嵌套面板一", html:"嵌套面板一", iconCls:"save"},  
15.            {title:"嵌套面板二", html:"嵌套面板二", iconCls:"search"},  
16.            {title:"嵌套面板三", html:"嵌套面板三", iconCls:"back"}  
17.        ]

请问如何让这些成为动态的

相关推荐

    Ext.Viewport布局

    Ext.Viewport、 Ext.TabPanel布局

    ExtJs 学习笔记 Ext.Panle Ext.TabPanel Ext.Viewport第1/3页

    使用Ext.Viewport搭一个简单布局(用一个小例子来总结本文所有内容) 面板是ExtJs控件的基础,很多控件都是在面板的基础上扩展的,或者他会与其他控件之间有关系。 面板由一个工具栏、一个底部工具栏、面板头部、面板...

    jsp+ext4(js部分由Ext Designer生成)

    1.Ext Designer生成的代码,如何使用;通过实例化来使用。 2.Ext 的model,store,grid使用,...Ext.container.Viewport .... 希望能给初学者一点启示吧。 如果有不明白的请我QQ:243596252;时间允许我会帮助大家。。。

    ExtJs4_笔记.docx

    第九章 Ext.Panel 面板控件、 Ext.window.Window 窗口控件、 Ext.container.Viewport 布局控件 72 一、面板控件 Ext.Panel 72 二、窗口控件 Ext.window.Window 74 三、布局控件 Ext.container.Viewport 77 第十章 ...

    Ext Js权威指南(.zip.001

    9.2.3 将body元素作为容器:ext.container.viewport / 435 9.3 面板 / 436 9.3.1 面板的结构 / 436 9.3.2 构件的放置:dockeditems / 438 9.3.3 面板标题栏构件:ext.panel.header与ext.panel.tool / 438 9.3.4...

    extjs4.0 实现了主页面框架 动态菜单 例子 表单 ajax

    extjs4.0 实现了主页面框架(主框架使用Ext.Viewport,banner使用Ext.panel.Panel,通过toolbar来放置按钮),包括左侧动态菜单实现(采用Ext.tree.Panel)动态从数据库加载数据来显示菜单(后台代码也在了通过json...

    关于viewport,Ext.panel和Ext.form.panel的关系

    那个深入浅出ext作者比我还懒 viewport存放Ext.panel对象,其容器中的成员可以以borderlayout方式布局

    Ext之ViewPort

    NULL 博文链接:https://kai2008.iteye.com/blog/350192

    ExtJSWeb应用程序开发指南(第2版)

    5.3 使用ViewPort 5.4 Ext.tab.Panel页签 5.5 本章小结 第6章 常用工具类与函数 6.1 非常有用的Ext.core.Element 6.2 Ext常用函数 6.2.1 Ext.onReady() 6.2.2 Ext.get() 6.2.3 Ext.select() 6.2.4 ...

    基于extjs的.NET3.5控件Coolite 1.0.0.34580(Preview预览版)

    44. Renamed <ext:ViewPort> to <ext:Viewport>. Change to lowercase "p". 45. Renamed <Body> inner property to <Content>. Affects all ContentPanel type controls including Panel, Window, Viewport ...

    精通JS脚本之ExtJS框架.part1.rar

    11.2.2 使用Viewport 11.2.3 实现表单元素横排 第12章 ExtJS对Ajax的支持 12.1 Ext.Ajax介绍 12.1.1 Ext.Ajax.request方法详解 12.1.2 Ext.Ajax.request操作示例 12.1.3 Ext.Ajax.request提交XML数据 12.2 ...

    关于ExtJS4.1:快捷键支持的问题

    问题一个页面有两个面板,都...代码示例 代码如下:/// ”Ext/ext-all-debug-w-comments.js”> Ext.onReady(function () { var viewport = Ext.create(‘Ext.container.Viewport’, { layout: { type: ‘vbox’, al

    学习ExtJS border布局

    一、Border布局由类Ext.layout.BorderLayout... 二、应用举例 代码如下: Ext.onReady(function(){ new Ext.Viewport({ layout:”border”, items:[{region:”north”, height:50, title:”顶部面板”}, {region:”south

    精通JS脚本之ExtJS框架.part2.rar

    11.2.2 使用Viewport 11.2.3 实现表单元素横排 第12章 ExtJS对Ajax的支持 12.1 Ext.Ajax介绍 12.1.1 Ext.Ajax.request方法详解 12.1.2 Ext.Ajax.request操作示例 12.1.3 Ext.Ajax.request提交XML数据 12.2 ...

    ExtDemoProject.zip

    使用EXTJS 开发的DEMO 含有Ext.container.Viewport 使用 使用EXTJS 封装JQUERY的插件 Ext.dashboard.Dashboard 看板布局使用 Ext.tree.Panel 树型控件使用 ACE代码编辑器 在EXTJS中的使用

    ExtJS 2.0实用简明教程 之Border区域布局

    看下面的代码: 代码如下:Ext.onReady(function(){ new Ext.Viewport({ layout:”border”, items:[{region:”north”, height:50, title:”顶部面板”}, {region:”south”, height:50, title:”底部面板”}, {...

    入门基础学习 ExtJS笔记(一)

    大致看了几天的书籍 查阅了API。头脑里也记不下多少,学习还是动手比较好。就试着开始写写: 首先:开始搭个 界面... [removed][removed] [removed][removed] 定义一个Ext.Viewport: 在items的属性里设置: 头部: 代

    EXT经典示例大全

    1.入门 2.ext事件处理 3.面板 4.工具栏 5.Viewport 6.窗口 7.对话框 内附:ext语法总结.txt

    ext4的MVC小例子

    'viewport > goodslistview': { afterrender: function(gp){//侦听goodslistview渲染 gp.down('button[action=testBtn1]').on('click',function(){ //侦听goodslistview工具条上action=testBtn1的按钮单击...

Global site tag (gtag.js) - Google Analytics