spingMVC的Ajax表单提交

本人不才,写点自己的心得。希望对大家有所帮助。

总体分为五个步骤:①springMVC中加入配置 ②页面Ajax请求 ③注解声明 ④导入jackson-all-1.9.11.jar 包(此包功能强大,感兴趣的童鞋可以问度娘) ⑤静态文件放过

首先第一步:

        <!--  从请求和响应读取/编写字符串 -->
<bean id="stringConverter"
class="org.springframework.http.converter.StringHttpMessageConverter">
<property name="supportedMediaTypes">
<list>
<value>text/plain;charset=UTF-8</value>
</list>
</property>

</bean>

        <!-- 用于将对象转换为 JSON  -->
<bean id="jsonConverter"
class="org.springframework.http.converter.json.MappingJacksonHttpMessageConverter"></bean>
<bean
class="org.springframework.web.servlet.mvc.annotation.AnnotationMethodHandlerAdapter">
<property name="messageConverters">
<list>
<ref bean="stringConverter" />
<ref bean="jsonConverter" />
</list>
</property>

</bean>

在我理解看来基本都是固定格式,固定写法。

第二步:

        注:此处的action没有实际意义可以忽略,因为具体的提交地址会在ajax请求写

       <form action="/springMVC/user/login" method="post">
用户名:<input type="text" name="name" id="name"/> <br/>
密码:<input type="password" name="pwd" id="pwd"/> <br/>
生日:<input type="text" name="birthday"/>
<input type="button" value="登录" id="btnAjax"/> 
</form>

        Ajax请求

        $(function(){

            注:button按钮提交 通过id 触发具体的单击事件 

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

                var url ="/springMVC/user/ajaxTest";//  <%--/项目名称/命名空间(没有设置可以不写)/提交给要处理的方法/--%>

                $.post(

                    url,    

                    {username:$("name").val(),password:$("pwd").val()},<%-- 方法参数对应表单元素 传参--%>

                    function(data){<%-- 回调函数 --%>

                         $("#info").html(data.userName);<%-- 页面打印 体现异步效果 --%>

                     }

                      "json" <%-- json格式 --%>

                ),

            });

        });

第三步:

//不明白注解意思的建议百度查阅,很好懂。

//此方法目的在于地址栏输出login 跳转到Login.jsp

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

  public String toLogin(){

      return "Login";//注意此处字符串区分大小写,要和你的jsp名一致,然后通过配置文件会交给视图解析器来处理

   }

@RequestMapping("/ajaxTest",method=RequestMethod.POST)  

public @ResponseBody User ajaxTest(String username,Model model){//关键在@ResponseBody加上就是ajax了

    User user  = new User();

    if("admin".equals(username)){

        user.setUserName("老王");

    }

    else if("123".equals(username)){

        user.setUserName("老李");

    }

    return user;

}

第四步:基本算是完成了,但是别忘了导入jar包,我用的是这个jackson-all-1.9.11.jar 

第五步:ajax需要js文件也别忘记导入,我用的是这个

<script type="text/javascript" src="/springMVC/js/jquery-1.7.js"></script>

最后总结:记住五个步骤,遇到问题不要怕,百度查阅。多加练习。都是一个套路。

        

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值