无废话ExtJs 系列教程
关注
分享
扫一扫
文章平均质量分 85
回嘉
这个作者很懒，什么都没留下…
展开
专栏收录文章
- 默认排序
- 最新发布
- 最早发布
- 最多阅读
- 最少阅读
-
通过Servlet让Extjs GridPanel 显示数据库数据
文章分类:Web前端 GridPanel上显示数据,可以使用Struts,也可以使用Servlet的方法,两者的用法相近,所以,给出后者的实现方法: 这里先列出HTML代码: Html代码 <%@ page language="java" import="java.util.*" pageEncoding="GB18030"%> ...2010-05-31 10:16:48 · 212 阅读 · 0 评论 -
无废话ExtJs 系列教程十三[页面布局：Layout]
首先解释什么是布局： 来自百度词典的官方解释：◎ 布局 bùjú： [distribution;layout] 对事物的全面规划和安排，布：陈设；设置。 我对布局理解是“把**东西放在**位置显示”[动词]。 ok，我们这节课就讲一下怎么样把 ExtJs 的组件，放到我们想放置的位置。 一、常用布局 (1)ContainerLayout：默认布局方式，其他布局继承该类进行扩展功能。显...原创 2015-06-04 18:22:59 · 171 阅读 · 0 评论 -
无废话ExtJs 系统教程十四[列表：GridPanel]
在Extjs中，GridPanel用于数据显示，即我们平时说的列表页。在本节中，我们先对GridPanel有个基本的认识，后继过程再做Demo练习详细讲解在开发中的应用。 1. index.jsp代码如下： <%@ page language="java" import="java.util.*" pageEncoding="utf-8"%> <!DOCTYPE...原创 2015-06-11 14:43:59 · 210 阅读 · 0 评论 -
无废话ExtJs 系列教程十五[树：TreePanel]
1. index.jsp代码如下： <%@ page language="java" import="java.util.*" pageEncoding="utf-8"%> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> &l原创 2015-06-13 13:23:03 · 141 阅读 · 0 评论 -
无废话ExtJs 系列教程十七[数据交互：AJAX]
1.代码如下： <%@ page language="java" import="java.util.*" pageEncoding="utf-8"%> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head&原创 2015-06-14 19:42:36 · 149 阅读 · 0 评论 -
无废话ExtJs 系列教程十八[继承：Extend]
在开发中，我们在使用视图组件时，经常要设置宽度，高度，标题等属性。而这些属性可以通过“继承”定义在我们定义的新组件中，从而达到重用的目地。 1.代码如下： <%@ page language="java" import="java.util.*" pageEncoding="utf-8"%> <!DOCTYPE HTML PUBLIC "-//W3C//DTD...原创 2015-06-14 22:48:19 · 184 阅读 · 0 评论 -
无废话ExtJs 系统教程十九[动态复选框：RemoteCheckboxGroup]
我们在开发系统的时候经常会用到 Checkgroup 由后台取出的情况，然而在 ExtJs CheckboxGroup 并没有提供该服务端数据源的属性。 1.代码如下： 1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xht...原创 2015-06-15 14:03:32 · 183 阅读 · 0 评论 -
无废话ExtJs 系列教程十四-----(一) [锚点布局：AnchorLayout ]
1:Ext.layout.AnchorLayout 它是根据容器大小为其所包含的子面板进行定位的布局，对应面板布局(layout)配置项的名称为anchor，如果容器大小发生变化时，所有子面板的位置都会根据规则进行重新计算，并自动渲染，它的主要配置项如下： (1)：anchorSize(父容器提供) anchor布局用anchorSize配置项用来设置虚拟...原创 2015-07-03 15:32:44 · 409 阅读 · 0 评论 -
无废话ExtJs 系列教程十四-----(二) [列布局：ColumnLayout ]
1：Ext.layout.ColumnLayout 它是为构建某个垂直式结构而准备的布局，当中包含已指定宽度的多个列，可以使用columnWidth或者width来指定子元素所占的列宽度 属性width总是以像素来固定宽度，并必须是数字大于或者等于1，属性columnWidth是百分比相对单位，并必须是百分比字符串区间是大于0小于1 使用columnWidth属性...原创 2015-07-03 15:48:06 · 233 阅读 · 0 评论 -
无废话ExtJs 系列教程十四-----(三) [卡片式布局：CardLayout ]
1：Ext.layout.CardLayout的介绍 CardLayout可以看作是一叠卡片，从上面看起来就像是一张卡片，可以把中间的卡片抽出来，放到最上面，可每次只能看到一张卡片，它能够 满足安装向导、Tab选项卡等应用面板显示的需求。 代码： <%@ page language="java" import="java.util.*" pageEncoding="...原创 2015-07-03 15:54:13 · 333 阅读 · 0 评论 -
无废话ExtJs 系列教程十四——(四) [边框布局：BorderLayout ]
1：边框布局--BorderLayout Ext.layout.BorderLayout对应面板布局layout配置项的名称为border。该布局包含多个字面板，是一个面向应用的UI风格的布局，它将整个容器分为5个部分， 分别是east, south, west, north, center, 加入到容器中的字面板需要指定region配置项来告知容器需要加入到哪个部分，并且该布局...原创 2015-07-03 16:01:55 · 437 阅读 · 0 评论 -
无废话ExtJs 教程十二[员工信息表Demo：AddUser]
前面我们共已经学过10种表单组件，这些组件是我们在开发过程中最经常用到的，所以一定要用到非常熟练才可以，今天我们会通过一个员工信息表实例，再把这些组件串一下。 (1)TextField (2)Botton (3)NumberField (4)Hidden (5)DataFiedl (6)RadioGroup (7)CheckBoxGroup (8)Combobox (9)File (10)Ed...原创 2015-06-04 17:41:07 · 300 阅读 · 0 评论 -
无废话ExtJs 教程十一[下拉列表联动：Combobox_Two]
不管是几级下拉列表的联动实现本质上都是根据某个下拉列表的变化，去动态加载其他下拉列表，如：省、市、地区。 当我们监听到省变化时，向service端发送省的编号，service端根据收到的"省"编号到数据库中查询该省所对应的市信息， 地区同理，抓住这一点，我们只需要监听 combobox 的 select 事件并在其中实现逻辑即可。 1.代码如下： 1 <!DOCTYPE...原创 2015-06-03 21:16:45 · 123 阅读 · 0 评论 -
无废话ExtJs 教程十[下拉列表：Combobox]
继上一节内容，我们在表单里加了个一个下拉列表： 1. index.jsp代码如下： <%@ page language="java" import="java.util.*" pageEncoding="utf-8"%> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> &原创 2015-06-03 21:03:46 · 210 阅读 · 0 评论 -
无废话ExtJs 教程[API的阅读和使用方式]
首先解释什么是 API： 来自百度百科的官方解释：API（Application Programming Interface,应用程序编程接口）是一些预先定义的函数，目的是提供应用程序与开发人员基于某软件或硬件的以访问一组例程的能力，而又无需访问源码，或理解内部工作机制的细节。 ExtJs的Api必须部署到IIS上，ExtJS的API首页如下图所示： 左侧是搜索栏，可以搜索所有的Ext...原创 2015-05-26 16:58:16 · 155 阅读 · 0 评论 -
无废话ExtJs 教程一[学习方法]
本教程的制作是基于我从零开始学习ExtJs到正式在项目中应用的整个学习过程和方法，其中肯定会有许多不足之处，还请大家多多批评指正。 很多书籍和网上的教程大多是从API与ExtJs的机制开始讲解的。而在我的学习过程中发现，没有接触过ExtJs或对javascript了解很少的同事，在看到前面几章的时候，感觉到很茫然（本人也系菜鸟），所以对此深有感触。针对此问题，我的学习方法如下： 1.从Ext...原创 2015-05-26 17:07:59 · 119 阅读 · 0 评论 -
无废话ExtJs 教程二[Hello World]
我们在学校里学习任何一门语言都是从"Hello World"开始，这里我们也不例外。 1. index.jsp代码如下： <%@ page language="java" import="java.util.*" pageEncoding="utf-8"%> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Trans原创 2015-05-26 17:27:52 · 588 阅读 · 0 评论 -
无废话ExtJs 教程三[窗体：Window组件]
1. index.jsp代码如下： <%@ page language="java" import="java.util.*" pageEncoding="utf-8"%> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <原创 2015-05-26 21:35:59 · 209 阅读 · 0 评论 -
无废话ExtJs 教程四[表单：FormPanel]
继上一节内容，我们在窗体里加了个表单。如下所示代码区items:form。 1. index.jsp代码如下： <%@ page language="java" import="java.util.*" pageEncoding="utf-8"%> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//...原创 2015-05-26 22:35:34 · 205 阅读 · 0 评论 -
无废话ExtJs 教程五[文本框：TextField]
继上一节内容，我们在表单里加了个两个文本框。如下所示代码区的第42行位置，items: [txtusername, txtpassword]。 1. index.jsp代码如下： <%@ page language="java" import="java.util.*" pageEncoding="utf-8"%> <!DOCTYPE HTML PUBL...原创 2015-05-27 14:45:35 · 297 阅读 · 0 评论 -
无废话ExtJs 教程六[按钮：Button]
继上一节内容，我们在表单里加了个两个按钮“提交”与重置。如下所示代码区， buttons: [.........]。 1. index.jsp代码如下： <%@ page language="java" import="java.util.*" pageEncoding="utf-8"%> <!DOCTYPE HTML PUBLIC "-//W3C//DTD H...原创 2015-05-27 18:32:13 · 208 阅读 · 0 评论 -
无废话ExtJs 教程七[登陆窗体Demo：Login]
在这节我们通过前几节讲的内容做一个登陆页面，把前几节讲的内容贯穿一下。 1. index.jsp代码如下： <%@ page language="java" import="java.util.*" pageEncoding="utf-8"%> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional/...原创 2015-05-28 17:15:35 · 179 阅读 · 0 评论 -
无废话ExtJs 教程八[数字字段：NumberField、隐藏字段Hidden、日期字段：DataFiedl]
继上第六节内容，我们在表单里加了个一个数字字段，隐藏字段，日期字段。如下代码所: 1. index.jsp代码如下： <%@ page language="java" import="java.util.*" pageEncoding="utf-8"%> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional...原创 2015-06-01 17:31:31 · 241 阅读 · 0 评论 -
无废话ExtJs 教程九[单选组：RadioGroup、复选组：CheckBoxGroup]
继上一节内容，我们在表单里加了个一个单选组，一个复选组: 1.代码如下： <%@ page language="java" import="java.util.*" pageEncoding="utf-8"%> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <ht原创 2015-06-02 18:48:11 · 325 阅读 · 0 评论 -
无废话ExtJs 系列教程十四----(五) [折叠布局：AccordionLayout ]
1：折叠布局---AccordionLayout的简单介绍 Ext.layout.AccordionLayout对应面板布局layout配置项的名称为accordion，该面板继承自Ext.layout.FitLayout布局，该布局会包含多个字面板， 任何时候都只有一个字面板处于打开状态，每个子面板都内置了对展开和收缩功能的支持，最终效果可以像手风琴那样拉来拉去，就是类似QQ 面板的...原创 2015-07-03 16:10:54 · 315 阅读 · 0 评论