flex+jump的培训资料

更新时间：2024-04-24 17:38:01 阅读量：综合文库文档下载

说明：文章内容仅供预览，部分内容可能不全。下载后的文档，内容与下面显示的完全一致。下载之前请确认下面内容是否您想要的，是否完整无缺。

flex居中推荐度：
相关推荐

Flex程序员培训教程

Flex产品

概述

学习FLEX，必须了解什么是RIA。

RIA，Rich Internet Application ，也就是富互联网应用。这个富字是重点。传统的HTML页面元素非常有限，开发人员在页面刷新和相应速度都受到较大的困扰。

FLEX ，最开始是由Macromedia公司2004年发布，2005年4 月，Adobe公司收购Macromedia公司，现在FLEX系Adobe公司系列产品。官方网站：www.adobe.com.

Flex拥有两种开发语言：

MXML：一种XML标识语言，用来进行组件布局，数据绑定等，和HTML语言有点类似。 ActionScript：现在用的版本是3.0，flex的编程语言，一般业务逻辑操作需要用到，可以完成MXML的所有操作。

Flex3包含以下几个部分：

Flex3 SDK是Flex产品最基础也是必需的组件。包括编译器、Flex类库以及调试工具。 Flex Builder 3/flash Builder 4是基于eclipse的集成开发环境。支持可视化界面以及MXML和ActionScript编写,可以下载独立的Flex 开发工具（Flex Builder 3/flash Builder 4），也可以下载插件（作为eclipse的插件）使用。

Flex的安装

Flex Builder 3和Flash Builder 4安装基本一样。

选择好语言环境，点击OK，开始安装:

安装完成以后，启动Flex

Flex Builder 3的启动页面

安装好的Flex 对应的目录结构如下：

对应的sdk文件夹，包含sdk2.0和sdk3.1两个不同的版本 Flex对应的插件包 Flex Builder的启动文件

Flex开发入门

Hello world 案例的开发案例描述

通过经典的“Hello World”案例来了解Flex的运行方式。

开发步骤

启动Flex Builder 3

通过“开始?程序?Adobe?Flex Builder 3”启动Flex开发环境。

创建项目

打开Flex Builder 3之后，选择“File?New?Flex Project”创建一个新项目；

点击此处切换透视

1) 在弹出的“Flex Project”视图中，配置相关参数。“项目名称”：FlexTest，如图2.1-2所示。

点击Next,选择Flex编译后的输出目录，默认的就可以了

点击Next，可以指定原码路径，默认为src，可以选择SDK的版本等

点击Finish。

创建好的项目目录结构如下：编译后输出目录公共库(swc文件)的存放目录

1、原码路径编译部署、运行

选中FlexTest.mxml，打开此文件，输入如下代码

选中FlexTest，点击运行

效果如下，点击“Hello world”按钮，弹出一个对话框，显示“Hello World!”

Flex常用组件

1、Label 2、TextInput 3、TextArea 4、ComboBox 5、DateField 6、Button 7、DataGrid 。。。。。

Label主要用于字段说明，就像下图的“用户名：”和“用户说明”，一般Label字段的显示值不作为数据提交；TextInput用作文本值输入，不支持换行，如果想要输入的值可以换行可以使用TextArea，TextInput和TextArea跟html中text和textarea完成的任务是一样的，用于数据的提交和显示。

ComboBox下拉框，提供数据选择，比如说性别、类型等

DateField日期框，对于需要用到日期的地方很有用

可以通过设置formatString来改变日期的格式，比如说formatString=”YYYY-MM-DD”，则显示的值为“2011-03-08”

Button按钮，Button使用非常普遍，在进行前后台交互的时候往往使用按钮来提交数据，

DataGrid，用于数据列表的显示，比如说要显示一个查询后的列表集合，DataGrid就非常有用了

Flex常用数据校验控件

如上图所示，如果输入的字符串超过10位，则提示错误。同样，如果不输入任何字符串则提示“此项为毕输项”，如果输入的字符串小于3为则提示“不能小于3位”，如下图所示：

和的使用方式和

基本相同，只是这些控件对应的属性不同，不在赘述。

这是几种常用的，当然还有其他数据校验控件，比如说对电话号码、信用卡等的校验。

Flex深入开发

在深入开发过程中将使用Flash Builder 4和SDK3.3版本，用我们在实际开发中使用的UITemplate+jump这两套框架。

UITemplate中常用的控件介绍

1、文本控件，如下图所示:

效果如下，如果单击

则可以清空文本框里面的内容：

2、显示列表控件（带复选框），如下图所示：

效果如下，可以通过选择左边的复选框来进行相应的操作；

如果要进行多选，可以设置allowMultipleSelection=”true”,上图导入xmlns:bankcomm=” com.bankcomm.*”是为了支持数据字典的使用，如下代码所示

3、显示列表控件（不带复选框），如下图所示：

dict=\

headerText=\

处理

结

果

dataField=\dataTipField=\textAlign=\sortable=\

效果如下，可以通过设置allowMultipleSelection=”true”来进行多选，和上面描述的列表不同

点就是这个显示列表没有复选框；它同样也支持数据字典，对数据字典的使用和上面的列表是一样的

4、分页控件，如下图所示：

效果如下，可以通过点击刷新当前页,可以在代表一次显示多少条

跳到首页，

跳到下一页，

跳到下一页,

跳到尾页，

里面输入不小于10的数字（小于10的会默认用10来处理），

5、下拉树控件，如下图所示：

效果如下，可以看到点击下拉框会弹出一连串的树，

6、，类似于一个容器，可以在左上角显示说明信息，如下图所示：

效果如下，可以看到左上角的“失联补录信息”说明信息

7、普通下拉框，如下图所示：

效果如下，可以看到它不像下拉树一样，如图所示可以通过点击

来清空当前选项

8、flex自带的控制条，如下图所示：

效果如下，可以看到它里面可以包含其他的控件，保持美观的效果

9、数字控件，如下图所示：

效果如下，这个控件只能输入数字类型的数据，可以控制只能输入整数或者可以输入小数, 也可以通过点击

来清空已输入的数据

10、日期控件，如下图所示：

效果如下，可以通过定义日期类型的格式（通过设置formatString=”YYYY-MM-DD”），则点击右边的

来选择日期，会按照已定义好的格式来显示日期, 也可以通过点击

来清空已

选择的日期

11、复选框列表,需导入xmlns:check=\com.flextoolbox.controls.*\，

如下图所示：

效果如下，可以点击复选框选中一条记录，如果要支持多选，可以设置

allowMultipleSelection=\true\（默认就是多选）

开发案例描述

? 案例的基本需求

在数据库中存在一个学生信息表，通过Flex+jump架构能够进行学生信息的查询、增加、修改、删除。

在查询功能中，以学生姓名、性别、出生日期范围作为查询条件，其中学生姓名为模糊查询，性别为完全匹配查询且通过下拉列表选取查询条件，查询结果要求分页处理。 ? 学生信息表STU的表结构字段名称 STUID STUNAME SEX AGE ADDRESS PHONE BIRTH

数据类型 VARCHAR(10) VARCHAR(40) CHAR INT VARCHAR(100) VARCHAR(20) Date 数据长度 10 40 1 200 20 是否主键 YES NO NO NO NO NO NO 备注学生编号学生姓名 1-男,2-女,3-未知年龄家庭住址联系电话出生日期开发步骤

创建数据库表（省略，已经设置好）

? 建表SQL脚本（DB2）

drop table STU; CREATE TABLE STU (

STUID VARCHAR(10) not null , STUNAME VARCHAR(40), SEX CHAR2(1), AGE INTEGER, ADDRESS VARCHAR(200), PHONE VARCHAR(20), BIRTH DATE,

CONSTRAINT PK11 PRIMARY KEY (STUID) );

? 初始数据SQL脚本

insert into STU values('1000000','张三丰','1',25,'北京海淀区中关村大街

号

','13923070219',DATE('1985-11-23'));

insert into STU values('1000001','张无忌','1',26, '上海张江高科技园区碧波路456号','13572113015',DATE('1984-11-30'));

insert into STU values('1000002','张小宝','0',23,'北京市海淀区彩和坊路8号天创科技大厦东门1301室','13804061974',DATE('1987-05-19'));

insert into STU values('1000003','赵大海','2',24,'广州市天河区体育东路122号羊城国际商贸中心大厦西塔2102-2104室','15123040319',DATE('1986-03-31'));

insert into STU values('1000004','赵小新','0',25,'北京海淀区中关村22号','15823010577',DATE('1985-05-08')); insert into STU values('1000005','李中正','2',23,'成都高新区创新中心起步区府河基地高朋大道12号B座209-210室','15323010356',DATE('1987-04-19'));

insert into STU values('1000006','李亚南','0',24,'长沙市国家高新技术开发区火炬村M2组团金荣科技园7楼','13923010319',DATE('1986-12-24'));

搭好flex+jump的开发环境

? 将下载下来的UITemplate改名为student,并导入到Flash Builder 4的包资源管理器中

（UITemplate由项目组提供）,如下图所示：

在包资源管理器中右击?导入?选择Flash Builder 项目?下一步?选择项目文件夹?浏览（选择你已改名为student的这个项目）?完成

导入好项目之后需要查看一下SDK版本是不是正确的，通过右击student（项目）?属性?Flex编译器?注意看版本是不是Flex 3.3SDK,如果不是，则需要更换版本

Flex搭建好之后，将src目录下的loginurl.json修改为以下代码：

{

\学生信息管理

\/m3_uidemo/testPage.html\

\学生信息维护

\\:\

这是一段JSON报文，在flex+jump框架中前后台的数据传递用的就是JSON报文格式。

这样设置好以后，就可以运行这个Flex框架了，通过点击果如下图所示:

，运行后的结

可以输入任何用户名和密码（因为这只是一个模板）,点击登录，显示页面如下：

注意左边显示的功能菜单项，是我们刚刚在loginurl.json中配好的信息,不过现在还不能用，只是一个模型而已。

如果在点击时出现了如下错误，

则需要设置“Web 浏览器”,窗口?首先参数?常规?web 浏览器?internet Explorer?确定,如下图所示：

? 配置好jump后台，将jump-demo(with Eclipse).rar下载下来之后解压（相应的demo由

项目组提供），解压之后打开Eclipse，路径就在解压目录下（eclipse/eclipse.exe），打开后如下图所示：

导入项目组提供的一个名叫plrm的后台应用，在这个应用的基础上进行练习。首先需要开发人员配置一下jdk，用jdk1.5就可以了;

配置config目录下的jump-db.xml（连接数据库的配置）设置连接数据库的url、用户名和密码即可,如下代码所示：（省略，已经设置好）

然后点击start运行一遍，如果不报错就代表成功了，接下来就是进行代码的开发了。

前后台代码的开发

? Flex页面代码的编写

1、新建一个stu的包名，如下图所示：

2、创建好stu包以后，在这个包下面创建一个模块名为StudentIndex,步骤如下图所示：

点击完成，生成StudentIndex.mxml，代码如下：

在这里创建模块的原因是可以通过模块来加载部分信息，不需要一运行index就加载所有的信息，减轻了一下加载大量信息给服务器造成的压力；用模块还有一个好处是能够使应用结构清晰明了。

创建好模块之后就是编写代码了，以学生姓名、性别、出生日期范围作为查询条件查询出学生列表信息，编写好的代码如下：一、Flex端

1、在StudentIndex.mxml中编写如下代码

xmlns:jwolib=\http://www.jwolib.com/2006/mxml\

xmlns:bankcomm=\com.bankcomm.*\>

paddingBottom=\10\center\vertical\>

verticalAlign=\middle\>

change=\'')\

clear=\false;\false\

id=\stuName\200\40\/>

verticalAlign=\middle\>

showClearButton=\true\data\label\>

verticalAlign=\middle\>

showClearButton=\true\true\true\formatString=\YYYY-MM-DD\/>

paddingTop=\0\center\0x000000\>

icon=\@Embed('assets/page_find.png')\查询\查询\70\/> icon=\@Embed('assets/cross-circle.png')\重置\重置\70\/>

icon=\@Embed('assets/add.png')\新增\新增\70\/> icon=\@Embed('assets/cart_edit.png')\修改\修改\70\/> icon=\@Embed('assets/cart_edit.png')\查看\查看\70\/> icon=\@Embed('assets/cart_delete.png')\删除\删除\70\/>

height=\100%\true\{gridPage.dataProvider}\>

dataTipField=\stuId\/>

dataTipField=\stuName\/>

dataTipField=\sexLabel\/> dataTipField=\age\/> dataTipField=\birth\/> dataTipField=\phone\/> dataTipField=\address\/>

dataUrl=\{Global.IP}queryStudentWithPage.ajax\>

import com.bankcomm.Connect; import com.bankcomm.URLParameter;

import mx.controls.Alert; import mx.core.Application; import mx.events.CloseEvent; import mx.managers.PopUpManager;

import xxx_Util.Global;

//新增学生信息后台访问路径

private var addStuUrl:String=Global.IP+\;

//修改学生信息后台访问路径

private var editStuUrl:String=Global.IP+\;

//删除学生信息后台访问路径

private var delStuUrl:String=Global.IP+\;

//设置查询学生信息的条件

private function setObj():Object{

var obj:Object=new Object(); obj.stuName=stuName.text;

obj.sex=sex.selectedItem==null?\:sex.selectedItem.data;

}

obj.birthStart=birthStart.text; obj.birthEnd=birthEnd.text; return obj;

//查询学生信息

private function queryList():void{ }

gridPage.param=setObj; gridPage.loadData();

//点击重置按钮时调度，用来清空条件元素

private function initSelect():void{ }

private function add_stu():void{

stuName.text=\; stuName.htmlText=\; sex.selectedValue=\; sex.selectedIndex=-1; birthStart.text=\; birthEnd.text=\;

//学生信息新增

//创建一个弹出式的TitleWindow,用来进行学生信息的新增

var

studentOper:StudentOper=StudentOper(PopUpManager.createPopUp(Application.application.parent,StudentOper,true));

//设置TitleWindow的标题信息

studentOper.title=\学生信息新增\;

//定义页面元素为可编辑的

studentOper.writable=true;

//给TitleWindow的sure按钮增加一个监听

studentOper.sure.addEventListener(MouseEvent.CLICK,function(event:MouseEvent):

if(studentOper.checkStu()) {

void{

//设置新增学生信息所需的参数

var param:URLParameter=new URLParameter(); param.trainID=\; param.trainProcess=\;

param.reqBody={PARAMS:studentOper.getValues()};

//访问后台进行学生信息的新增

Connect.request({url:addStuUrl,params:param.toParameter(),callback:function(r:Object,e:Event):void{

}

});

PopUpManager.centerPopUp(studentOper);

}

//如果新增成功，则关闭titileWindow，并刷新主页面的列表信 if(r.RSP_HEAD.TRAN_SUCCESS==\) { } }});

//通过派发出一个CloseEvent.Close事件来关闭 studentOper.dispatchEvent(new gridPage.loadData();

息

TitleWindow

CloseEvent(CloseEvent.CLOSE));

//学生信息修改

private function edit_stu():void{

//判断主页面的列表是否选择了记录

if(stuGrid.selectedItems==null || stuGrid.selectedItems.length==0) { }

Alert.show(\请选择需要修改的学生记录\,\提示\); return;

Alert.show(\只能选择一条学生记录进行修改\,\提示\); return;

}else if(stuGrid.selectedItems.length!=1){

//创建一个弹出式的TitleWindow,用来进行学生信息的修改

var

studentOper:StudentOper=StudentOper(PopUpManager.createPopUp(Application.application.parent,StudentOper,true));

//设置TitleWindow的标题信息

studentOper.title=\学生信息修改\;

//定义页面元素为可编辑的

studentOper.writable=true;

//给TitleWindow的页面元素设置值

studentOper.setValues(stuGrid.selectedItem);

//给TitleWindow的sure按钮增加一个监听

studentOper.sure.addEventListener(MouseEvent.CLICK,function(event:MouseEvent):

if(studentOper.checkStu()) {

void{

//设置修改学生信息所需的参数

var param:URLParameter=new URLParameter(); param.trainID=\; param.trainProcess=\;

param.reqBody={PARAMS:studentOper.getValues()};

//访问后台进行学生信息的修改

Connect.request({url:editStuUrl,params:param.toParameter(),callback:function(r

}

});

PopUpManager.centerPopUp(studentOper);

}

:Object,e:Event):void{

//如果修改成功，则关闭titileWindow，并刷新主页面的列表if(r.RSP_HEAD.TRAN_SUCCESS==\) { }

信息

//通过派发出一个CloseEvent.Close事件来关闭studentOper.dispatchEvent(new gridPage.loadData();

TitleWindow

CloseEvent(CloseEvent.CLOSE));

}});

//学生信息删除

private function del_stu():void{

//判断主页面的列表是否选择了记录

if(stuGrid.selectedItems==null || stuGrid.selectedItems.length==0) { }

Alert.show(\请选择需要删除的学生记录\,\提示\); return;

//保存选择的学生编号

var stuIds:String=\;

//通过循环来取得学生编号信息，并组合成一个字符串用来作为删除操作的参数

for(var i:int=0;i

stuIds=stuIds.substring(0,stuIds.length-1);

stuIds+=\+stuGrid.selectedItems[i].stuId+\;

//设置删除学生信息所需的参数

var param:URLParameter=new URLParameter(); param.trainID=\; param.trainProcess=\;

param.reqBody={PARAMS:{stuIds:stuIds}};

//访问后台进行学生信息的修改

Connect.request({url:delStuUrl,params:param.toParameter(),callback:function(r:

}

Object,e:Event):void{

//如果删除成功，则给出提示信息，并刷新主页面的列表信息

if(r.RSP_HEAD.TRAN_SUCCESS==\) { }

Alert.show(\成功删除\,\提示\); gridPage.loadData();

}});

//学生信息查看

private function stu_detail():void{

//判断主页面的列表是否选择了记录

if(stuGrid.selectedItems==null || stuGrid.selectedItems.length==0) { }

Alert.show(\请选择需要查看的学生记录\,\提示\); return;

Alert.show(\只能选择一条学生记录进行查看\,\提示\); return;

}else if(stuGrid.selectedItems.length!=1){

//创建一个弹出式的TitleWindow,用来进行学生信息的查看

var

studentOper:StudentOper=StudentOper(PopUpManager.createPopUp(Application.application.parent,StudentOper,true));

//设置TitleWindow的标题信息

studentOper.title=\学生信息查看\;

//定义页面元素为不可编辑

studentOper.writable=false;

]]>

//设置sure和reset按钮不可见

studentOper.sure.visible=false; studentOper.reset.visible=false; studentOper.sure.includeInLayout=false; studentOper.reset.includeInLayout=false;

//给TitleWindow的页面元素设置值

studentOper.setValues(stuGrid.selectedItem); PopUpManager.centerPopUp(studentOper); }

2、在stu包下面在创建一个StudentOper.mxml的titleWindow,用来进行学生信息的增、删、

改、查等操作，创建过程如下所示：

选择MXML组件，

最后点击完成，TitleWindow创建完毕。 3、代码如下：

xmlns:jwolib=\http://www.jwolib.com/2006/mxml\

xmlns:bankcomm=\com.bankcomm.*\>

import mx.events.CloseEvent; import mx.managers.PopUpManager; import mx.validators.Validator;

[Bindable]

public var writable:Boolean=true;

//用来保存用户点击修改按钮时从主页面中传过来的对象

private var oldObj:Object=null;

//保存学生编号

private var oldStuId:String=\;

//返回页面元素对应的值

public function getValues():Object{ }

var obj:Object=new Object(); obj.stuName=stuName.text; obj.sex=sex.selectedItem.data; obj.age=age.text; obj.birth=birth.text; obj.phone=phone.text; obj.address=address.text; obj.stuId=oldStuId; return obj;

//给页面元素进行赋值

public function setValues(obj:Object):void{ }

oldStuId=obj.stuId; stuName.text=obj.stuName; stuName.htmlText=obj.stuName; sex.selectedValue=obj.sex; age.text=obj.age; age.htmlText=obj.age; birth.text=obj.birth; phone.text=obj.phone; phone.htmlText=obj.phone; address.text=obj.address; address.htmlText=obj.address; oldObj=obj;

//重置页面元素中的值

public function resetS():void{

if(oldObj==null) {

stuName.text=\; stuName.htmlText=\;

}

stuName.showClearButton=false; sex.selectedIndex=0; age.text=\; age.htmlText=\;

age.showClearButton=false; birth.text=\; phone.text=\; phone.htmlText=\;

phone.showClearButton=false; address.text=\; address.htmlText=\;

address.showClearButton=false; stuName.text=oldObj.stuName; stuName.htmlText=oldObj.stuName; sex.selectedValue=oldObj.sex; age.text=oldObj.age; age.htmlText=oldObj.age; birth.text=oldObj.birth; phone.text=oldObj.phone; phone.htmlText=oldObj.phone; address.text=oldObj.address; address.htmlText=oldObj.address;

}else{

//给TitleWindow增加关闭函数

protected function titlewindow_closeHandler():void { }

PopUpManager.removePopUp(this);

//对页面元素值进行数据校验

public function checkStu():Boolean{ }

var

if(Validator.validateAll(array).length==0) { }

return false;

return true;

array:Array=[stuNameValid,ageValid,birthValid,phoneValid,addressValid];

]]>

paddingBottom=\10\>

change=\'')\

clear=\false;\false\

id=\stuName\200\40\

editable=\{writable}\/>

valueField=\data\label\{writable}\>

change=\'')\false;\showClearButton=\false\

id=\age\200\0-9\

editable=\{writable}\/>

formatString=\YYYY-MM-DD\true\200\birth\enabled=\{writable}\/>

change=\'')\

clear=\false;\false\

id=\phone\200\{writable}\/>

change=\'')\

clear=\false;\false\

id=\address\200\

editable=\{writable}\/>

horizontalAlign=\center\0x000000\> toolTip=\确定\70\/>

icon=\@Embed('assets/cross-circle.png')\重置\重置\70\/> icon=\@Embed('assets/cross-circle.png')\关闭\关闭\70\/>

不能为空\{stuName}\property=\text\{sure}\click\/>

为空\{age}\text\{sure}\click\/>

能为空\{phone}\text\{sure}\click\/> 不能为空\{address}\property=\text\{sure}\click\/> minValue=\0\{sex}\selectedIndex\{sure}\triggerEvent=\click\/>

二、Jump端

1、在com.bankcomm.plrm.action目录下创建一个Class类，名叫StuAction,创建好之后在类

中编写如下代码:

package com.bankcomm.plrm.action;

import java.util.HashMap; import java.util.List; import java.util.Map;

import org.springframework.beans.factory.annotation.Autowired;

import com.bocom.jump.bp.core.Action; import com.bocom.jump.bp.core.Context;

import com.bocom.jump.bp.core.CoreException; import com.bocom.jump.bp.service.sqlmap.SqlMap;

public class StuAction implements Action { @Autowired private SqlMap sqlmap; //分页查询学生列表信息 public void selectStudentWithPage(Context context) throws CoreException { try { Map dataMap = context.getDataMap(); Map map = (Map) dataMap.get(\ int count=sqlmap.queryForObject(\ Map pageCond=(Map)dataMap.get(\ int limit=pageCond.get(\ if(limit<10) limit=10;

int start=pageCond.get(\ List stuList=null; if(count>0) { stuList=sqlmap.queryForList(\map, start, limit); } Map ls=new HashMap(); ls.put(\ ls.put(\ ls.put(\ context.setData(\ context.setData(\ } catch (Exception e) { e.printStackTrace(); throw new CoreException(\学生信息查询\学生信息查询失败\ } } //根据学生编号查询学生详细信息 public void selectStudentByStuId(Context context) throws CoreException{ try { Map dataMap = context.getDataMap(); Map map = (Map) dataMap.get(\ Map stuMap=sqlmap.queryForObject(\map); context.setData(\ } catch (Exception e) { e.printStackTrace(); throw new CoreException(\学生信息详细查询\学生信息详细查询失败\ } } //新增学生信息 public void addStudent(Context context) throws CoreException{ try { Map dataMap = context.getDataMap(); Map map = (Map) dataMap.get(\ String stuId=sqlmap.queryForObject(\ map.put(\ sqlmap.insert(\ } catch (Exception e) { e.printStackTrace(); throw new CoreException(\学生信息新增\学生信息新增失败\

} } //根据学生编号修改学生信息

public void editStudentByStuId(Context context) throws CoreException{ try { Map dataMap = context.getDataMap(); Map map = (Map) dataMap.get(\ sqlmap.update(\ } catch (Exception e) { e.printStackTrace(); throw new CoreException(\学生信息修改\学生信息修改失败\ } }

//根据学生编号字符串删除学生信息

public void delStudentByStuIds(Context context) throws CoreException{ try { Map dataMap = context.getDataMap(); Map map = (Map) dataMap.get(\ sqlmap.delete(\ } catch (Exception e) { e.printStackTrace(); throw new CoreException(\学生信息删除\学生信息删除失败\ } } }

2、编写好上述代码之后然后在config.sqlmap.mappings目录下创建一个

Student_Mapping.xml，这个文件是用来编写操作中需要用的sql，代码如下：

insert into STU

values(#{stuId:VARCHAR},#{stuName:VARCHAR},#{sex:VARCHAR},#{age:INTEGER}

,#{address:VARCHAR},#{phone:VARCHAR},#{birth:DATE})

update STU set

stuname=#{stuName:VARCHAR},sex=#{sex:VARCHAR},age=#{age:INTEGER},address=#{address:VARCHAR},

phone=#{phone:VARCHAR},birth=#{birth:DATE} where stuId=#{stuId:VARCHAR}

delete from stu where stuid in (${stuIds})

3、处理好相应的sqlMap后还有最后一步，配置jump-action-hz.xml和

jump-process-hz.xml 配置jump-action-hz.xml如下：

xmlns=\

xmlns:osgi=\ xmlns:xsi=\ xmlns:util=\

xsi:schemaLocation=\

http://www.springframework.org/schema/osgi http://www.springframework.org/schema/util http://www.bocom.com/schema/jump-core

http://www.springframework.org/schema/beans/spring-beans-3.0.xsd http://www.springframework.org/schema/osgi/spring-osgi-2.0-m1.xsd http://www.springframework.org/schema/util/spring-util-3.0.xsd http://www.bocom.com/schema/jump-core-1.0.xsd\>

主要是后面这个部分，通过这个配置给StuAction类创建一个引用。配置jump-process-hz.xml如下：

xmlns=\

xmlns:xsi=\

xsi:schemaLocation=\

http://www.springframework.org/schema/osgi http://www.springframework.org/schema/util http://www.bocom.com/schema/jump-core

xmlns:osgi=\ xmlns:util=\

operations=\ />

这里每一个process都是jump的一个入口，通过配置process可以确定访问路径，我们在前台配置的private var addStuUrl:String=Global.IP+\;中的addStu就是在process中配置的，通过这样的配置就能正确的找到需要调用的类和方法；其中的action标签通过ref=”stuAction”就是引用的我们在jump-action-hz.xml中配置的StuAction类，operations=” selectStudentWithPage”就是引用StuAction类中方法。

结果展现

根据条件分页查询学生信息，如下图所示：

输入条件，学生姓名=“张”，性别=“男”，查询结果如下：

点击【新增】，弹出如下页面：

依次输入如下信息，“陆小凤”,“男”，29，“2010-01-01”，“77882500”，“隋唐时期”，然后点击【确定按钮】

点击【确定】之后可以看到列表页面多了一条数据，选择这条数据点击【查看】，结果如下：

回到主页面，选择一条记录点击【修改】，弹出如下页面：

将性别修改为女，学生年龄为30，点击【确定】，可以在主要看到信息已修改成功，如下图所示：

最后选择陆小凤这条记录，点击【删除】，弹出“删除成功”提示信息，如下图所示：

总结

到这里，这样一个简单的增删改查操作已完成，其中在开发的时候有几个需要注意的地方：

1、在前台配置访问后台路径时注意路径名称需要跟jump-process-hz.xml中要一致，private