y1d2y3xyz
- 浏览: 257017 次
- 性别:
- 来自: 深圳
-
最新评论
-
dhunter：
mongodb 需要auth 怎么加呢？
linux下mongodb+nodejs环境搭建 -
y1d2y3xyz：
xie666 写道html.push('<td alig ...
javascript DOM操作性能-----创建DOM -
xie666：
html.push('<td align="c ...
javascript DOM操作性能-----创建DOM -
轩辕丶菓菓：
bushkarl 写道那我后台用struts2，我的name一 ...
Ext表单之loadRecord用法详解 -
heikediguo：
这样不会按照你想要的顺序加载。
加载JS文件
文章列表
这里从一个最简单的grid表格开始讲起!
grid其实就是实现数据显示的表格，但其功能比HTML中的table功能要强很多，具体强在那里，接下来会一一介绍！
grid中最重要最常用的属性主要有以下几个：store,autoExpandColumn ,cm(colModel ) ,columns ,disableSelection ,enableColumnHide ,enableHdMenu, loadMask ,sm(selModel) ,stripeRows ,trackMouseOver ,view ,viewConfig ....相对来说属性设置项比较多，我们下面就从一个简单的例子来说明 ...
这里实现的效果的从XML文件中把数据动态的载入到表单中！其实这部分在和data部分一起将比较好，但因为这里也比较容易，涉及到的配置也不多！
Form 表单的Action.load方法的应用，由于前面有详细的讲解Action方法是应用，所以这里不用多讲，为了简单明了，这里只设置俩个配置选项，URL 和 waitMsg,
读取数据部分主要涉及到 Ext.data.XmlReader，即xml数据读取器，record表示数据记录所在的标签名，记住这是指特定的一条记录，不过我这里这里只有一条记录！
fields指记录的字段，其中name表示表单中的字段，mapping表示对应的xml文件中对于的标签名 ...
这个方法是BaseForm的一个公用方法，用法比较常用，之前没有想过要专门的去讲这么个方法的运用，但看到官方实例里面也有详细的讲这个方法的具体应用，而且我觉得是比较实用的方法！从BaseForm的角度出发，他一个是所有form组件的基类，实用他的这个方法同样可以用到其子类上，比如FormPanel，我这里就是通过FormPanel来实现这个功能的！
我整理是把grid里面的数据加载到form表单中相对应字段中去！
RowSelectionModel是表示行选择模式CellSelectionModel就表示单元格选择模式
由于前面也有涉及到grid相关知识，这里能理解就行，后面会做详细讲解，同 ...
form组件实现数据的提交和验证!这里讲的主要是后台验证,和服务器脚本的交互!
我用的是EXT2.2.1版本,比2.0版本配置项功能更强!
数据提交用到的是submit函数！继承自Action，其自身多了一个clientValidation 配置项，表示是否设置前台验证!
我这里就讲了数据的提交,至于数据的加载基本上是一样的配置!自己参照API手册,主要是熟悉后台数据生成格式!JSON,并且success和data是必须的!
action.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN& ...
所有设置都是按部就班，没有特别的地方，基本就只是功能的开启与关闭
createLinkText：‘’表示创建超链接按钮的提示信息，在这之前别忘记了把
Ext.QuickTips.init();
Ext.form.Field.prototype.msgTarget = 'title';
加上，否则提示信息会看不到效果！
还有一个选项就是buttonTips,其接受一个对象
sourceedit:{title:'源代码编辑',text:'切换源代码编辑模式'}
具体实现看代码，
htmleditor.html
<!DOCTYPE html PUBLIC "-//W3C//DTD ...
这个组件都比较简单，要配置的参数很少
radio和checkbox设置基本一样，就几个属性(checked,handler,boxLabel,inputValue),俩个的配置一样的可以比较着进行学习，checkboxgroup和radiogroup设置也是完全一样的，他们的属性主要包括:columns和vertica ...
先看效果：
只是简单的介绍textField相关的组件的应用！
其中也较为详细的介绍了formpanel和fieldset的应用，对于界面的布局来讲特别是对表单布局来讲formpanel的应用无疑是最频繁的，
formpanel是专门为表单设置的一种布局，所以设计到的配置项也比较多，同时它也是panel，即面板容器，熟悉JAVA的就知道其实不管是命名还是实现功能都有点模仿JAVA，甚至是整个组件的类组织形式，其实如果清楚整个源文件的组织结构的话学起来就快很多，做为基于对象的JS也是一样，从BoxComponent到Container再到field再到我们今天讲的textfield都是一层层的继 ...
先看一下总体的效果!
这个界面是我由http://java-cn.com/members/register.jsp的注册表单转换成ExtJS实现!
这个表单基本上用到了ExtJS的所有组件,我先通过这个表单把EXT的Form组件功能呈现给大家，然后我会在接下来的文章中，针对每个组件进行具体的讲解!代码看上去会比较多,但实现很容易,目前还是针对界面部分,虽然表单中会设计到store方面的,但我都是用的本地模式实现,至于结合后台语言的话我会在grid和store那部分专门去讲解!
我分俩个文件(form.html和register.js)和一个图片文件夹,先看源码:
form.html:
...
首先：鉴于目前自己在学习ExtJS，也把自己学习中的一些东西给大家分享，我看网上很多朋友都很关注Extjs的，我自己也刚开始学习没多久！把《EXTJS WEB应用程序开发指南》从头到尾也看了俩遍，这本书讲得不算深入，但对于API讲解得比较多，在某种程度上讲可以看作这是中文版的API,如果是还没有入门的朋友可以去买来看看，我看完这本书的感觉就是知道EXT的基本大概结构，说到实际能弄出个什么东西来还真不好讲！只能说知道怎样去查API文档了！至于想进一步的深入或者提高的话我建议把官方的例子全部自己做一次，而且可以看一下《JavaScript凌厉开发--Ext详解与实践》相对来讲这本更适合进阶或者说是提 ...
学生信息表：studentinfo
+----+---------+-------+
|name kecheng fenshu
|张三 语文 81
|张三 数学 75
|李四 语文 76
|李四 数学 90
|王五 语文 81
|王五 数学 100
|王五 英语 90
+----+---------+-------+
SQL:
+------------------------------------------ ...
- 2009-07-07 15:26
- 浏览 1123
- 评论(0)
项目表：project
合同表：hetong
收款表：inmoney
SQL:
+---------------------------------------------------------------------------------+
create table project(id varchar(10),name varchar(10));
create table hetong(id varchar(10),projectid varchar(10),hetongkuan varchar(10));
create table inmoney(id v ...
- 2009-07-07 15:14
- 浏览 1106
- 评论(0)
+---------------------------------------------------------------------------------------+
球队信息表：tb_team
CREATE TABLE IF NOT EXISTS `tb_team` (
`team_id` int(11) NOT NULL auto_increment COMMENT 'KEY',
`team_name` varchar(50) NOT NULL COMMENT '球队名称',
`team_coach` varchar(20) default NULL ...
- 2009-07-07 08:30
- 浏览 1177
- 评论(0)
结构表：TabTest
+-------+--------+
|t_Code t_Name |
| 1 a |
| 2 b |
| 11 c |
+-------+--------+
SQL：
+-----------------------------------------------------------+
Create table TabTest(t_Code varchar(10),t_Name varchar(10));
insert into TabTest values('1' ...
- 2009-07-06 15:46
- 浏览 959
- 评论(0)
图书信息表：books
+------+---------+
bookid bookname |
| 1 a |
| 2 b |
| 3 v |
| 4 d |
| 5 f |
| 6 g |
| 7 h |
| 8 j |
| 9 k |
| 10 l |
| 11 r |
| 12 t ...
- 2009-07-06 15:11
- 浏览 962
- 评论(0)
员工业绩表：inwork
+----+------------+----------+------------+
| id sname smoney sprovice
+----+------------+----------+------------+
| 1 zhangsan 2098 A
+----+------------+----------+------------+
| 2 lishi 3000 B
+----+------------+----------+----- ...
- 2009-07-06 11:12
- 浏览 1169
- 评论(0)