写点前端，vm + jquery + controller

我要啰里八嗦一些东西了。以下陈述，基于这些事实：

前端页面：.vm, velocity + jquery

MVC：加强版的spring mvc

Controller：@Controller, @RequestMapping，.htm, .json, GET, POST

 

1）.htm

每一个.htm，在控制器里@Controller，意味着要写一个方法，该方法头部顶着@RequestMapping(value = "/topicEventcode.htm", method = RequestMethod.GET)。这样，页面刷新多次，都可以执行到该方法内。

我之前遇到这样一个问题，写的不是GET，而是POST，导致页面刷新后，找不到控制器了，断点断在方法内怎么都进不来，呵呵，现在想来，这个太傻了。

刷新/重新加载页面，那么你的这些内容都会被重新赋值渲染。这些值，就是从controller中带回来的，你可以放在ModelMap里带回来，也可以直接写入response带回。

我一般使用modelMap,存些String类型的值，以前存储过复杂的对象，结果渲染不出来，是因为json序列化的时候，这个对象序列化失败。

 

表1-1

                        #if($!mode == "topicStatistics") 
                            #foreach($line in $!data)
                                <tr>
                                    <td>$!line.topic</td>
                                    <td>$!line.eventcode</td>   
                                    <td>$!line.fromApps</td> 
                                    <td>$!line.toApps</td> 
                                    <td>$!line.numPerDay</td> 
                                    <td>$!line.exProperty</td> 
                                    <td>$!line.statusEnum</td>
                                    <td>$!line.gmtCreate</td>     
                                    <td>$!line.gmtModified</td>       
                                    <td>$!line.operator</td>
                                    <td>
                                        <a href="#updateDataDiv" onclick="replaceFormTS('$!line.topic','$!line.eventcode','$!line.fromApps','$!line.toApps', '$!line.numPerDay','$!line.exProperty','$!line.statusEnum')" class="boxLink" >修改</a>
                                    </td>
                                </tr>
                            #end    
                        #end

 

 

2）controller，方法

public String query(ModelMap modelMap, WebRequest request);  然后通过request.getParameter("mode")来获取.vm中

public String query(ModelMap modelMap, String mode); 

这两种方式都可以获取前端提交过来的页面元素的值。

但在使用过程中，发现public String uploadFile(ModelMap modelMap, MultipartFile file); 这样使用，我上传的文件内容总是取不出来，需要这样转一下：

写一个类，并用这个类做参数public String uploadFile(ModelMap modelMap, FileForm fileForm); 这样通过fileForm的get方法，就可以把文件内容取出来了。

public class FileForm {

     private MultipartFile file;

     // ... getters and setters 

}

 

3）.json

写一个页面，还是比较费神的，所以我目前更倾向于使用json这种轻量级的方式了。

.json可以做到，只提交页面上的部分内容到controller里，例如只提交其中一个form。但同时也意味着，整个页面不会重新刷新，值不会自动被重新加载。

如果你确实又需要加载某些值，或只是向用户提示个什么，那么你需要使用ajax方式提交.json请求，并在ajax调用时，注入一个回调函数。

这样，我们可以在modelMap/response里写入待更新的值/待提示给用户的值，并在回调函数里做相应处理就好。

   function postAddFormTM(){
        jQuery.post("insertRecordTM.json", 
                            {topic:$("input[name='aaa']").val(), eventcode:$("input[name='bbb']").val() }, 
                            function(result){
                                alert(result.result.resultMsg);
                            }
        );
    }

在使用过程中，我aaa的值为中文的时候，传到controller里后就变乱码了，那么就需要对这些中文框进行特殊编码，var aaaChinese = encodeURIComponent($("input[name='aaa']").val());

在controller里，aaa= URLDecoder.decode(aaaChinese, "UTF-8");进行解码就可以正确取出中文了。