`

Ext工具条

阅读更多

 1 在jsp指定位置(某个div处)生成工具条
 jsp页面:

.query{
   background-image:url(../images/toolBar/application_form_find.png) !important;
}
<div id="toolBar" class="x-toolbar"></div>

 

<script>

  var indexFun = function(){

    return{

          query: function(){

            

          },

          insert: function(){

 

         },

         update: function(){

 

         },

         download: function(){

 

         }

    }

  }();

</script>


<script>
 Ext.QuickTips.init();  //提示信息
 /**
  * 初始化ext工具条
 */
function initToolBar(){
var toolbar = new Ext.Toolbar({
   applyTo: 'toolBar',
   items: [{
    text: '查询',
    tooltip: '查询',
    iconCls: 'query',  //这里的query为css class类名
    handler: indexFun.query
   },'-',{
    text: '新增',
    tooltip: '新增',
    iconCls: 'add',
    handler: indexFun.insert
   },'-',{
    text: '修改',
    tooltip: '修改',
    iconCls: 'update',
    handler: indexFun.update
   },'-',{
    text: '导出',
    tooltip: '导出',
    iconCls: 'download',
    handler: indexFun.download
   }]
  });
 }

 //初始化       
 Ext.onReady(function(){
  initToolBar();
 });
</script>

分享到:
评论

相关推荐

    EXT分页工具条

    EXT分页工具条是一款在Web应用中常用的组件,主要用于展示数据集的分页信息,让用户能够方便地浏览大量数据。EXT是一个强大的JavaScript框架,它提供了丰富的UI组件和数据管理功能,使得开发人员能够构建高性能、...

    ext3.jar ext使用非常多

    EXT框架的核心在于其丰富的组件库,包括数据网格、表单、窗口、工具栏、菜单等,这些组件具有高度可定制性和交互性,使得开发者可以轻松创建出功能强大、界面美观的Web应用。EXT3是EXT发展中的一个重要阶段,它引入...

    Windows 7下使用Ext2Fsd读取写入Linux Ext3&Ext4分区文件

    1. 运行Ext2Fsd程序,它会在任务栏上显示一个图标。右键点击图标,选择“打开设备选择窗口”。 2. 在弹出的窗口中,你会看到你的硬盘列表。找到挂载的Linux分区,通常会显示为未知类型的设备。选中后,点击“分配...

    Ext 文件,表格,工具栏,邮件,RSS,小图标素材

    "Ext 文件,表格,工具栏,邮件,RSS,小图标素材"这一主题涉及到的是一个图标素材集,专为Ext框架或者与之相关的Web应用设计提供图形资源。下面将详细介绍这些图标在不同场景中的应用和重要性。 首先,我们来谈谈...

    Ext框架开发文档及ext-core.js

    6. **工具栏(Toolbars)**:EXT的工具栏组件可以轻松添加各种按钮、菜单和分割线,为用户提供便捷的操作入口。 7. **Ajax支持**:EXT内置了Ajax通信机制,能够方便地进行异步数据请求,与服务器端进行数据交互。 ...

    EXT可视化工具,Ext_Designer_Preview附带安装说明

    6. **设计与预览**:利用工具提供的拖放功能,将EXT组件从工具栏拖入设计画布,调整大小和位置,设置属性。实时预览功能让你能在设计过程中随时查看组件的最终效果。 7. **生成代码**:完成设计后,EXT_Designer_...

    EXT2.0,EXT4.0,JS

    EXT JS 2.0是该框架的一个早期版本,提供了丰富的组件库,包括表格、面板、菜单、工具栏等,使得开发者可以轻松创建复杂且美观的用户界面。此版本引入了新的布局管理器、拖放功能增强以及对Ajax的优化支持。 ...

    EXT扩展Htmleditor,在工具栏中添加插入图片按钮,可选择图片插入到编辑器中(也可添加其他功能按钮)

    本教程将深入讲解如何在EXT Htmleditor的工具栏中添加一个插入图片的功能按钮,并拓展讨论EXT Htmleditor的其他自定义可能性。 首先,我们来理解EXT Htmleditor的基本结构。Htmleditor是一个基于IFrame的组件,它...

    Ext中xtype和vtype.

    * tbseparator:一个工具栏分隔符组件,用于分隔工具栏项。 * tbspacer:一个工具栏间隔符组件,用于间隔工具栏项。 * tbsplit:一个工具栏拆分按钮组件,用于拆分某些操作。 * tbtext:一个工具栏文本项组件,用于...

    ext 中文源代码

    它提供了大量的预定义组件,如表格、树形视图、菜单、工具栏、面板等,这些组件可以灵活组合,快速搭建复杂的Web界面。EXT的组件系统基于MVC(Model-View-Controller)设计模式,有利于实现松耦合的代码结构,提高...

    ext 3.3 中文 chm

    6. 工具栏和菜单(Toolbars and Menus):如何创建和使用工具栏、下拉菜单等交互元素。 7. 表单(Forms):表单组件的使用,包括字段验证、表单提交等。 8. 图表(Charts):EXT 3.3的图表组件,如何创建各种统计...

    ext UI效果模板

    3. 工具栏和菜单:提供常用操作的快捷入口,可以自定义图标和事件。 4. 导航和布局:如选项卡面板、 accordion布局、浮动窗口、弹出对话框等,帮助构建层次分明的页面结构。 5. 图标和图像:EXT内置了丰富的图标库,...

    ext-3.4.1包

    在EXT JS 3.4.1中,开发者可以找到一系列预定义的可复用组件,如表格、面板、菜单、工具栏、窗口等,这些组件都具有高度定制性,可以根据需求调整外观和行为。 这个压缩文件"ext-3.4.1.zip"很可能包含了EXT JS库的...

    jq-extgrid v1.2 表格插件

    http: www extgrid com extgrid 是一款jquery上的gird插件 界面风格采用了类似easyui extjs 界面风格样式 可通过...extgrid具有列大小 位置改变 排序 分组 分页 工具栏 扩展行 rowNumber 多选列 编辑列 行列 [更多]

    ext3.0所有控件演示代码

    这个压缩包文件提供了EXT3.0中的几乎全部控件的演示代码,覆盖了表格、表单、分页工具栏以及图标等多个重要组件的使用方法。下面将详细介绍这些知识点。 1. 表格(Grid):EXT3.0的表格控件是其核心功能之一,能够...

    Ext组件说明 Ext组件概述

    **Toolbar(工具栏)** Toolbar组件提供了一种放置按钮、菜单和其他工具的地方。它可以被配置为固定位置,以便在页面滚动时仍然可见。 #### 三、表单组件详解 Ext的表单组件为创建复杂的数据输入界面提供了强大...

    EXT 最新icon图标大集合,节省时间专用

    EXT JS 提供了丰富的组件库,包括数据网格、表单、菜单、工具栏、对话框等,使开发者可以方便地创建功能完备、交互性强的Web应用。EasyUI则是EXT JS的一个轻量级版本,它基于EXT JS,但简化了一些高级功能,更加易于...

    ext.js拖动3.4版本插件

    总的来说,"ext.js拖动3.4版本插件"是一个实用的工具,它扩展了Ext JS的默认功能,让开发者可以更自由地设计和调整用户界面,提升用户的交互体验。通过熟练掌握这个插件,你可以创造出更加灵活和用户友好的Web应用。

    ext 3.0中文API

    EXT库的核心在于其组件模型,其中包括表格、面板、窗口、菜单、工具栏等多种UI元素。在EXT 3.0中,这些组件已经经过优化和增强,提供了更多定制选项和更好的性能。例如,EXT的GridPanel允许开发者创建数据驱动的表格...

    ext与媒体播放

    EXT提供了一套完整的组件化UI系统,包括表格、面板、图表、菜单、工具栏等,使得开发者能够方便地创建功能丰富且交互性强的Web应用。 在“EXT与媒体播放”这个主题中,我们主要探讨EXT如何与多媒体元素进行整合,以...

Global site tag (gtag.js) - Google Analytics