一步操作中，实现页面跳转与加载Ajax数据方案

      实际业务中遇到这样一个问题：

       1）在一个页面中操作数据，点击菜单中某个模块，跳转到另外一个页面(逻辑设计如此)

       2）跳转后，需要加载另外一个模块中的数据

       3）跳转后需要携带模块的id，便于定位展示数据

       实现思路：

由于Ajax必须在当前页面才能加载数据；所以不可能在同一个方法中，跳转新页面后再加载Ajax；设计如下

1）先跳转新页面，在新页面中添加Ajax更新方法

2）跳转携带任务id到浏览器URL

3）从浏览器URL中获取id，展示列表数据

         步骤如下：

1）点击跳转新页面按钮

οnclick="showHttpTask('+ id+ ')" 

2）跳转按钮调用方法，实现另外一个页面跳转：

function showHttpTask(id){
    window.location.href="/task/taskToCase?taskId="+id;}

3）在另外一个页面，初始化过程中，调用加载Ajax的方法：

if(showTaskId!=null){
                        showCase(data.taskId);//初始化页面中，调用Ajax数据更新
                    }    

/*  实现Ajax方法  */

function showCase(id){
    /*第一个Ajax请求，显示任务对应的用例*/
     $.ajax({
            url : '/task/searchMaidianCase',
            dataType:'json',
            type : 'get',
            data : {
                id : id,
            },
            success : function(result) {
                   //console.log("ccccccccc",result);
                   var res=result.maidian;
                   len = res.length;
                   var result;}

//后面处理省略

）

 

以下后台代码，作为上面跳转响应(仅供参考)：

1）/* 跳转新页面 */

@RequestMapping(value="/taskToCase")
                public String taskToCase(@RequestParam("taskId") int taskId) {
                    return "maidian/maidian";
                }

2）Ajax跳转调用接口

    @ResponseBody
                @RequestMapping(value="searchMaidianCase",method=RequestMethod.GET)
                         public  Object searchMaidianCase(@RequestParam("id") int id,Model model) {
                    try {
                        List<PointEntity> PointEntities=new ArrayList<PointEntity>();
                        PointEntities=Task.selectMaidianById(id);
                        model.addAttribute("maidian",PointEntities); 
                        //System.err.println("testing"+JSON.toJSON(model));        
                    } catch (Exception e) {
                        e.printStackTrace();
                    }       
                       return JSON.toJSON(model);
                        }

}