SpringMVC知识点

  1. 尽量别把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

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 218,122评论 6 505
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 93,070评论 3 395
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 164,491评论 0 354
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 58,636评论 1 293
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 67,676评论 6 392
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 51,541评论 1 305
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 40,292评论 3 418
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 39,211评论 0 276
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 45,655评论 1 314
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 37,846评论 3 336
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 39,965评论 1 348
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 35,684评论 5 347
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 41,295评论 3 329
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 31,894评论 0 22
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 33,012评论 1 269
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 48,126评论 3 370
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 44,914评论 2 355

推荐阅读更多精彩内容

  • 1. Java基础部分 基础部分的顺序:基本语法,类相关的语法,内部类的语法,继承相关的语法,异常的语法,线程的语...
    子非鱼_t_阅读 31,631评论 18 399
  • 1.JQuery 基础 改变web开发人员创造搞交互性界面的方式。设计者无需花费时间纠缠JS复杂的高级特性。 1....
    LaBaby_阅读 1,174评论 0 1
  • 1.JQuery 基础 改变web开发人员创造搞交互性界面的方式。设计者无需花费时间纠缠JS复杂的高级特性。 1....
    LaBaby_阅读 1,335评论 0 2
  • 工厂模式类似于现实生活中的工厂可以产生大量相似的商品,去做同样的事情,实现同样的效果;这时候需要使用工厂模式。简单...
    舟渔行舟阅读 7,761评论 2 17
  • 先讲一个故事,这个故事来源于《三体》,有一层令人不安的恐怖色彩,与火鸡有关。一个农场里有一一群火鸡,农场主 每天中...
    自控力君阅读 1,285评论 2 3