myeclipse配置ajax,MyEclipse整合SSM框架（四）：整合前端页面，经过ajax请求得到数据...

Spring+SpringMVC+Mybatis 框架已经搭建完成，其中包括：(1)maven工程的搭建 (2)框架所须要的配置文件的配置 (3)Mybatis 创建逆向工程连接数据库。相应的配置文件参见前几篇博客。javascript

此篇整理前端页面发送ajax 请求到后端，后端经过 Mybatis 连接数据库，返回JSON数据给前端页面，完成显示功能。前端

1、在webapp目录下创建 index.jsp ，将前端内容写入，这里以一个文本框为例(用到bootStrap 这个前端框架)：java

2、在 index.jsp 中写 ajax请求，这里用 jquery 来写，请求为/frames，带上参数 count=200即返回200个数，判断若是成功的返回数据，就将返回的数据写入 textarea进行显示jquery

$("#frame_getReal_btn").click(function(){

$.ajax({

url:"${APP_PATH}/frames",

data:"count=200",

type:"GET",

success:function(result){

$("#frame_getReal_btn").parent().find("textarea").empty();

var frames=result.returnData.frames;

if(result.code== 100){

$.each(frames, function(index, item){

$("#frame_getReal_btn").parent().find("textarea").append(item.pRealFrame1).append(" ");             });

}

}

});

});

3、在 controller 包下创建 FrameController.java ，类上添加注解 @Controller 交给 SpringMVC 处理相应的请求。添加方法 getRealFramesWithJSON( ) 返回 从数据库里查到的数据。@ResponseBody 注解自动封装 Map 数据成 JSON 数据返回给前端。web

@ResponseBody

@RequestMapping(value ="/frames", method = RequestMethod.GET)

publicMsg getRealFramesWithJSON(@RequestParam(value ="count", defaultValue ="10") Integer count) {

List frames = frameService.getFrame(count);

returnMsg.success().add("frames", frames);

}

4、在FrameController 类中 @Autowired 自动注入 FrameService的对象，在Service包下创建FrameService.java 类，添加注解 @Service ，用于处理业务逻辑和调用dao层。@Autowired 自动注入RealFrameMapper在dao层的这个类，前提是RealFrame 这个 javaBean 以及mybatis的映射文件，已经经过 Mybatis 逆向工程或者本身创建好。

ajax

publicList  getFrame(Integer count){

RealFrameExample realFrameExample = newRealFrameExample();

Criteria criteria = realFrameExample.createCriteria();

criteria.andIdLessThanOrEqualTo(count);

List list= realFrameMapper.selectByExample(realFrameExample);

returnlist;

}

5、调用dao 层自动连接数据库，查询数据返回给到前端显示。前两图分别是dao 层查询接口和 相应的 mapper.xml 映射文件。数据库