- 尽量别把JSP文件暴露出来，或者让前台直接访问JSP页面。JSP一般放在 /WEB-INF/jsp/ 目录下。Spring-mvc.xml配置如下：
<!-- 定义跳转的文件的前后缀 ，视图模式配置 -->
<bean class="org.springframework.web.servlet.view.InternalResourceViewResolver">
<property name="prefix" value="/WEB-INF/jsp/" />
<property name="suffix" value=".jsp"/>
</bean>
这样，在Controller里面可以直接定义跳转到的JSP页面。一般情况下，在Web.xml配置：
<!-- spring mvc servlet-->
<servlet>
<servlet-name>SpringMVC</servlet-name>
<servlet-class>org.springframework.web.servlet.DispatcherServlet</servlet-class>
<init-param>
<param-name>contextConfigLocation</param-name>
<param-value>classpath:spring-mvc.xml</param-value>
</init-param>
<load-on-startup>1</load-on-startup>
<async-supported>true</async-supported>
</servlet>
<servlet-mapping>
<servlet-name>SpringMVC</servlet-name>
<!-- 此处也可以配置成 *.do 形式 -->
<url-pattern>/</url-pattern>
</servlet-mapping>
过滤交给DispatcherServlet处理，这里的配置会过滤所有匹配 “/”的URL，因此会把访问静态文件如：CSS 、JS、Image等URL交给DispatcherServlet处理，从而不能正常访问静态文件，因此在Spring-mvc.xml中需要加上如下配置：
<mvc:resources location="/js/" mapping="/js/**"/>
<mvc:resources location="/css/" mapping="/css/**"/>
<mvc:resources location="/img/" mapping="/img/**"/>
<mvc:resources location="/fonts/" mapping="/fonts/**"/>
另外，如果想配合使用REST，又不想创建专门的Controller来处理路由，可在Spring-mvc.xml中增加这样的配置：
<!-- 配置直接转发的页面 -->
<!-- 可以直接相应转发的页面, 而无需再经过 Handler 的方法. -->
<mvc:view-controller path="success" view-name="success"/>
这样匹配 ".../success"这样的路由会跳转到，/WEB-INF/jsp/ 目录下的"success.jsp"。
2.Form表单提交
Form表单的实现有很多种方法，这里介绍一下Ajax+SpringMVC接收Ajax请求的方式。介绍一个jQuery的Form插件：jquery.form.min.js，Github地址。
jQuery Form插件是一个优秀的Ajax表单插件，可以非常容易地、无侵入地升级HTML表单以支持Ajax。jQuery Form有两个核心方法 -- ajaxForm() 和 ajaxSubmit()， 它们集合了从控制表单元素到决定如何管理提交进程的功能。另外，插件还包括其他的一些方法： formToArray()、formSerialize()、fieldSerialize()、fieldValue()、clearForm()、clearFields() 和 resetForm()等。
- HTML代码：
<form id="form1" method="post">
<table border="1">
<tr>
<td>用户名：</td>
<td>
<input type="text" name="loginName" /></td>
</tr>
<tr>
<td>爱 好：</td>
<td>
<input type="checkbox" name="cbLoveYy" value="1" />游泳
<input type="checkbox" name="cbLoveYx" value="1" />游戏
<input type="checkbox" name="cbLovePs" value="1" />爬山
</td>
</tr>
<tr>
<td colspan="2" style="text-align: center">
<input id="btnAjaxSubmit" type="submit" value="jQuery.ajax提交" />
</td>
</tr>
</table>
</form>
特别注意：Form中的所有表单元素必须有“name”属性。否则没法读取表单数据，从而服务器不能正常接收表单提交的数据。
- JS代码：
<script type="text/javascript">
$(document).ready(function () {
//将Form表单元素转成Object
$.fn.serializeObject = function()
{
var o = {};
var a = this.serializeArray();
$.each(a, function () {
if(o[this.name]){
if(!o[this.name].push){
o[this.name]=[o[this.name]];
}
o[this.name].push(this.value||'');
}else{
o[this.name] = this.value || '';
}
});
return o;
};
var options = {
url: 'items/', //SpringMVC action url
type: 'post',
beforeSubmit: showRequest, //提交前的回调函数
success: showResponse, //提交后的回调函数
dataType: 'text',
contentType:"application/json",
data: $("#form1").serializeObject() //转为对象，这样服务器接收JSON格式的数据，而不是urlencoded格式
};
function showRequest(formData, jqForm, options){
//formData: 数组对象，提交表单时，Form插件会以Ajax方式自动提交这些数据，格式如：[{name:user,value:val },{name:pwd,value:pwd}]
//jqForm: jQuery对象，封装了表单的元素
//options: options对象
var queryString = $.param(formData);
var formElement = jqForm[0]; //将jqForm转换为DOM对象
var address = formElement.cbLoveYy.value; //访问jqForm的DOM元素
return true; //只要不返回false，表单都会提交,在这里可以对表单元素进行验证
};
function showResponse(responseText, statusText){
//在output1 div中显示服务器返回的结果
if (responseText.length > 0)
$("#output1").text(responseText);
};
$("#form1").ajaxForm(options);
});
</script>
- SpringMVC Controller：
@RequestMapping(value ="/",method = RequestMethod.POST)
@ResponseBody
public String newItem(HttpServletRequest request,@RequestBody String item)
{
JSONObject itemJSON = new JSONObject();
itemJSON.put("code",200);
itemJSON.put("message","ok");
return itemJSON.toString();
}
另这篇文章也可参考[jQuery实现ajax提交form表单（可以是提交json），用springmvc接收。图文详解]
(http://www.cnblogs.com/klwyrn/p/5955152.html)。
3.对话框
一般点击删除，提交等按钮都需要弹出对话框，确认是否执行此操作。Bootstrap 的Modal可以实现此功能，但是界面有点单一，下面介绍一个jQuery插件，漂亮美观:sweetalert。
网友评论