`

ext.panel

    博客分类:
  • EXT
阅读更多

主要配置项:
      applyTo:在目标元素之后追加组件。
      renderTo:将目标元素作为新组件的容器。
      frame:是否渲染面板,默认为false。

      layout:面板的布局类型。
      layoutConfig:被选布局的配置项。

      title:设置面板头部的标题信息。
      header:设置是否创建面板头部,默认为false。
      headerAsText:是否在面板头部显示标题信息,默认为true。
      tools:工具按钮配置对象的数组。
      tools主要配置项:
      id:可选值有toggle、close、minimize、maximize、refresh、plus、minus、help、search、save等。
      qtip:按钮的提示信息。
      handler:单击按钮后触发的函数。
      draggable:是否可以拖曳,默认为false。



      collapsible:是否允许面板进行展开和收缩,默认为false。
      titleCollapse:是否允许通过单击面板头部进行展开和收缩操作,默认为false。
      hideCollapseTool:是否隐藏展开和收缩按钮,默认为false。
      collapsed:设置面板在第一次渲染时是否处于收缩状态,默认为false。
      animCollapse:是否在展开和收缩时显示动画效果,默认为true。

      autoWidth:是否使用自动宽度,默认为false。
      width:面板宽度,默认为auto。
      autoHeight:是否使用自动高度,默认为false。
      height:面板高度,默认为auto。
      autoScroll:是否自动显示滚动条,默认为false。
      disabled:面板是否失效,默认为false。

      floating:面板是否浮动。
      shadow:面板是否有阴影,此配置项只有在floating=true时有效。
      x:浮动时的X坐标。
      y:浮动时的Y坐标。

      draggable:面板是否可拖曳,默认为false。或者自定义DD对象。

tbar:设置面板的顶端工具栏。

      autoLoad:设置面板自动加载的url地址,作为body元素内容。items、html和contentEl的内容将被替代。

            autoLoad:'ajax1.htm'

            autoLoad: {url: 'ajax2.htm', params: 'foo=bar&wtf=1'}
      items:单独一个子组件或组件的数组。
      html:设置面板元素的内容,可以是HTML片段或DomHelper生成的内容。
      contentEl:设置面板的内容元素,可以是页面元素的id或已存在的HTML节点。
      bodyStyle:面板体的自定义样式。
      defaults:应用到面板容器中所有元素的配置对象。
      defaultType:面板中元素的默认类型,默认为panel。

      bbar:设置面板的底端工具栏。

      buttons:加入到面板底部中按钮配置对象的数组。
      buttonAlign:按钮的对齐方式。有效值包括left、center、right。默认为right。

分享到:
评论

相关推荐

    extjs中Ext.Panel和TreePanel 组件动态加载本地页面数据

    在EXTJS这个强大的JavaScript框架中,`Ext.Panel`和`TreePanel`是两个非常重要的组件,它们被广泛用于构建复杂的用户界面。这篇文章将探讨如何在这些组件中动态加载本地页面数据,以提升用户体验并实现灵活的数据...

    如何给Ext.panel增加一个背景图片

    如何给Ext.panel增加一个背景图片

    EXT dojochina 面板示例Ext.Panel.rar

    EXT dojochina 面板示例Ext.Panel.rar EXT dojochina 面板示例Ext.Panel.rar

    ExtJS4+Accordion+SERVLET/STRUTS2+JSON+Ext.tree.Panel实例

    这个实例结合了多个技术,包括Accordion布局、Servlet、Struts2以及JSON数据交互,以及Ext.tree.Panel组件,以创建一个功能丰富的用户界面。 Accordion布局是ExtJS中的一个布局管理器,它允许在一个区域内组织多个...

    Ext.Tree.Panel

    `Ext.Tree.Panel`是EXT JS库中的一个重要组件,用于展示层次结构的数据,通常用作树形菜单或文件系统目录的视图。这个组件是EXT JS框架中用于创建交互式、可扩展的树结构的工具。以下是对`Ext.Tree.Panel`相关知识的...

    Ext grid panel 滚动条位置不变

    ### Ext grid panel 滚动条位置不变 在前端开发领域,特别是在使用Ext JS框架时,保持滚动条位置不变是一个非常实用的功能。特别是在处理实时数据更新的场景下,这一功能可以确保用户在数据刷新后仍然停留在之前...

    一个简单的Ext.Window中插入图片的例子

    在`Ext.Window`中添加内容通常通过设置其`items`配置项来完成,可以是任何Ext JS支持的组件,如`Ext.Panel`、`Ext.form.FieldSet`或直接的HTML元素。 插入图片主要涉及以下步骤: 1. **创建图片对象**:在...

    extjs4的Ext.frorm.Panel控件属性说明和表单控件说明

    主要用例子说明extjs4的form表单的运用,其中有表单属性说明,表单控件运用说明如: title:'表单', //表单标题 bodyStyle:'padding:5 5 5 5', //表单边距 height:120, //表单高度 width:200, //表单宽度 ...

    EXT.form组件

    EXT.form组件是EXT JS库中用于构建表单界面的核心组件集合。这些组件提供了一系列丰富的控件,用于创建具有不同功能的交互式表单。在EXT JS中,表单组件不仅包含基本的输入字段,还支持复杂的输入类型和验证机制。 ...

    Ext.DataView 图片列表显示

    new Ext.Panel({ layout: 'fit', items : dataview, height: document.body.clientHeight, width: document.body.clientWidth, title: myTitle, bbar:pagebar, tbar : myTbar, renderTo: 'imageList' });

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

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

    ext使用--Panel和iframe联合使用时页面高度的解决方法

    var panel = Ext.create('Ext.Panel', { items: [iframe] }); ``` 2. **使用自定义布局**:如果我们发现ExtJS的内置布局无法满足需求,可以自定义布局。创建一个布局管理器,它能根据IFrame的实际高度来调整...

    EXT dojochina文本框示例Ext.form.TextField.rar

    1. **基本用法**:最简单的使用方式是在表单(`Ext.form.Panel`)中创建一个`Ext.form.TextField`,用于用户输入文本。例如: ```javascript var form = new Ext.form.Panel({ items: [{ xtype: 'textfield', ...

    Ext组件描述,各个组件含义

    **2.8 Panel (Ext.Panel)** - **xtype**: `panel` - **功能描述**:Panel 是一个包含标题、工具栏、主体等部分的容器。 - **主要用途**:作为独立的窗口或页面区域,提供丰富的布局和样式。 **2.9 Progress Bar ...

    extjs 可编辑的表格树 Ext.tree.ColumnTree Ext.tree.ColumnTreeEditor

    extjs 可编辑的表格树,每个单元格自定义编辑组件,可以自适应列宽,只有源码与例子,运行实例要修改路径,不然图片不能显示,注意etree.jsp的js引入路径...支持Ext2.x以上版本 如运行不了EmailTo : codeme9@gmail.com

    Ext.ux.SwfUploadPanel.js

    该组件通常表现为一个面板(Panel),用户可以在其中选择并上传多个文件。它的主要特点包括: 1. **多文件选择**:用户可以通过文件选择对话框一次性选取多个文件进行上传。 2. **进度条显示**:每个文件的上传进度...

    Extjs自动最大化panel

    在EXTJS中,"Extjs自动最大化panel"是一种高级布局技术,它允许用户创建一个能够自动适应并填充其容器的面板(Panel)。这种特性对于构建响应式和自适应的用户界面至关重要,尤其在现代Web应用中,用户期望界面能够...

    Ext.js教程和Ext.js API

    Ext.js 是一个强大的JavaScript库,专门用于构建富客户端的Web应用程序。它提供了丰富的用户界面组件和数据绑定功能,使得开发者可以构建出具有桌面应用级别的交互式网页应用。本教程和API文档聚焦于Ext.js 3.0版本...

    extjs grid.panel 项目 源码

    它提供了丰富的组件库,包括Grid Panel,它是展示和操作表格数据的核心组件。在"extjs grid.panel 项目 源码"中,我们可以深入理解如何利用ExtJS构建一个功能完备的数据网格。 Grid Panel是ExtJS中的一个核心组件,...

Global site tag (gtag.js) - Google Analytics