Extjs-note

组件:文本输入框,树形面板,标签面板,工具栏,面板

文本输入框:封装了原生浏览器文本输入表单控件,增加了诸如校验之类的特性

树形面板:以树状形式展示分级数据

主面板:

工具类Toolbar类提供了一种展现按钮和菜单等常用UI组件的方法

extjs中的核心:

Ajax通信,DOM操作,事件管理器

入门小栗子:

var tpl = Ext.create(‘Ext.Template‘,[‘hello {firstname} {lastName}!‘,‘Nice to meet you !‘]);

var formPanel = Ext.create(‘Ext.form.FormPanel‘,{

  itemId  : ‘formPanel‘,

  frame: true,

  layout : ‘anchor‘,

  defaultType: ‘textfield‘,

  defaults : {anchor: ‘-10‘,labelWidth: 65},

  items :[{

  freldLabel: ‘First name‘,

  name: ‘firstName‘

},{

  fieldLabel:‘Last name‘,

  name : ‘lastName‘

}],

  buttons:[{text: ‘Submit‘,

  handler: function(){

  var formPanel = this.up(‘#formPanel‘),

    vals = formPanel.getValues(),

    greeting = tpl.apply(vals);

  Ext.Msg.altert(‘Hello‘,greeting);

}

}]

})

Ext.onReady(function(){

  Ext.creat(‘Ext.window.Window‘,{

    height: 125,

    width: 200,

    closable:false,

    layout:‘fit‘,

    items : formPanel

}).show();

})

时间: 2024-11-08 19:47:57

Extjs-note的相关文章

Extjs之PagingToolbar

Ext.PagingToolbar,Ext.data.Store,Ext.data.HttpProxy,Ext.data.JsonReader,Ext.grid.GridPanel 在这里讲一下ExtJs下的一套分页步骤以及涉及到的Ext控件. 因为引入了Json作为数据传输格式,所以这里需要通过Http获得我们想要的数据: proxy: new Ext.data.HttpProxy ( { //url:'/Ajax/getEmpList.ashx' url: '/FX_LOG_QZ_T/get

ExtJS笔记 Tree

The Tree Panel Component is one of the most versatile Components in Ext JS and is an excellent tool for displaying heirarchical data in an application. Tree Panel extends from the same class as Grid Panel, so all of the benefits of Grid Panels - feat

extjs布局(一)

Ext常用的布局都在Ext.layout下,这里几乎涵盖了所有的布局方式,满足开发者需求.那么我们就其中常用的方式逐一介绍. Border布局 Border布局是Ext中常用布局方式(经常用到整个页面的总体布局),感觉用的几率很大.在看代码之前先熟悉一种特殊的容器ViewPort,它是对于浏览器视窗的抽象,你可以将它理解为浏览器的可见区域,它将渲染到document.body并自动调整大小,一个页面只能创建一个Viewport. var pnNorth=new Ext.Panel({ id:'p

ExtJS学习-----------Ext.Number,ExtJS对javascript中的Number的扩展

关于ExtJS对javascript中的Number的扩展,可以参考其帮助文档,文档下载地址:http://download.csdn.net/detail/z1137730824/7748893 下面对其中的部分方法进行介绍: (1)constrain constrain( Number number, Number min, Number max ) : Number 检查给定的数值是否在约束的范围内. If the number is already within the 如果再范围内就返

Extjs系列之一 开篇+function扩展

开篇: 用Extjs开发了3年半有余,现在项目转型至偏互联网产品半年有余,将js转型至了jquery系列,想来需要博客下Extjs的一些总结和记录,同时也为了温故而知新. 主要使用的是Extjs3.4这个版本,4.0之后的版本用过些许,主要是国内的浏览器的繁杂以及xp系统的更替实在够缓慢,4.0之后在老版本浏览器上加载速度不尽如人意. 下面的介绍就都基于自己最最熟悉的3.4版本. 既然是开篇,介绍一些通用,而又被广大extjs开发者们在初期不容易发现和运用的知识,也是本人觉得一个js库比较精华的

extjs define研究

Ext.define('MyApp.view.system.permission.Permission', { extend : 'Ext.panel.Panel', xtype : 'sys-permission', requires: [ 'MyApp.ux.Util', 'MyApp.model.SysRole' ], viewModel: { stores: { roleStore : ZUtil.createStore('SysRole', 'SysRole/read'), treeS

Extjs 动态生成表格

Extjs 动态生成表格 在web显示数据时,会遇到grid的列数和行数不确定的这种情况.如何来根据数据动态的创建表格呢?Extjs 的json data给我们带来了一个很好的比较简单的方法.  要创建一个grid需要确定它的列数,再根据数据的数量就可以确定行数了.  看到有人用过一种方法就是讲列的属性和数据一起放在json data里去,这样可以达到效果,但是不难发现,这样的话,就很难进行分页或者更新表格里的数据.  其实我们可以结合extjs官网上的那种固定列数的访问方法来动态生成表格.  

【翻译】EXTJS 编码风格指南与实例

原文:EXTJS Code Style Guide with examples Ext JS风格指南: 熟知的且易于学习 快速开发,易于调试,轻松部署 组织良好.可扩展和可维护 Ext JS应用程序的命名约定: 1.类 类名应使用驼峰命名(CamelCased).不要使用下划线,或其他连接字符.如:MyCustomClass 不是通过Sencha分发的类,永远不要使用Ext作为顶层命名空间.在类名中,应至少使用一次点号来划分命名空间.如TopLevelNamespace.MyClassName

ExtJS笔记5 Components

参考 :http://blog.csdn.net/zhangxin09/article/details/6914882 An Ext JS application's UI is made up of one or many widgets called Components. All Components are subclasses of theExt.Component class which allows them to participate in automated lifecycl

Extjs 4.2 设置buttontext为中文

可以在Ext.QuickTips.init();后加入如下代码: Ext.MessageBox.buttonText = { ok : "确定", cancel : "取消", yes : "是", no : "否" }; Extjs 4.2 设置buttontext为中文,布布扣,bubuko.com