struts2：后台验证表单(用Ajax局部验证)

      

      在工作中，很多时候都会接触表单，自然就会有表单的验证。有前台验证、后台验证，如果允许，建立前后台都验证，如果选一个的话，建议后台验证，前台验证很容易被越过的。以前对表单的验证，是将整个表单提交到后台，对需要验证的某些字段做验证，但是这样不太好，我们可以使用Ajax技术，只将我们需要验证的字段值提交到后台做验证，这样可以提高效率。下面简单对我工作中用到的做个总结：

 

1、现在我有个表单，有很多字段，我需要对其中的字段“用户名”做数据重复验证。就是数据库中用户名对应的数据是唯一的。

 

2、

      为这个字段设一个id，方便jquery对这个字段的操作；

     onblur 事件：在对象失去焦点时发生，当我们对“用户名”输入数据，鼠标离开的时候触发数据验证事件；

   <font> 规定文本的字体、字体尺寸、字体颜色。在“用户名”文本框后面加一个font标签，用于显示验证结果

 

部分表单：

<td><label>用户名:</label></td>

<td><input id="userName" name="form.userName" type="text"  value="${form.userName}"     οnblur="userNameJosn();" /> <font id="valideName"color="red"></font></td>

 

3、js验证代码：

      添加字段：             

  <script>
    var valideName="false";

    function userNameJosn() {
  $.post("jkgl!valideName.action", {
   yhm: $("#yhm").val()
  }, function(data) {
   valideName= data;
   if ("true" == data) {
    $("#valideName").text("用户已存在！");
   } else {
    $("#valideJkmc").text(" ");
   }
  });
 }

  </script>

 

 

修改字段：

 

 

<script>

   var userName="${form.userName}";//获取表单修改之前的值

    var valideName="false";

    function userNameJosn() {

var un=$("#userName").val();//获取表单修改后的值
  if(un==uaerName){//如果相等，就表示是没有修改，不应该给重复提示
   $("#valideName").text("");//提示信息为空
   valideName="false";
            return false;
  }

  $.post("jkgl!valideName.action", {
   yhm: $("#yhm").val()
  }, function(data) {
   valideName= data;
   if ("true" == data) {
    $("#valideName").text("用户已存在！");
   } else {
    $("#valideJkmc").text(" ");
   }
  });
 }

  </script>

 

我在后台是通过去根据yhm来对比数据库是否有这个数据，返回一个boolean值。

 

ajax：采用post方式提交，$.post(url,data,callback(function));我采用的是json传递yhm字段值；回调函数：

 

.val() 方法返回或设置被选元素的值。元素的值是通过 value 属性设置的。该方法大多用于 input 元素

.text("newThing"):替换原有的值