jquery ajax验证用户名是否存在(后台spring mvc)

controller层

@ResponseBody
@RequestMapping(value = "/user/isExist", produces = "application/json") 
public boolean isExist(Model model,String userName) {
    
    boolean flag = userPrivilegeServiceFacade
            .isExistUserName(userName);
    if(flag) {
        return true;
    }
    return false;
}

jsp页面

<form:form class="form-horizontal" id="form" method="post" modelAttribute="user" 
         enctype="multipart/form-data" >
         <div class="control-group">
               <form:label path="userName" class="control-label">
                   <spring:message code="system.user.userName" />
               </form:label>
               <div class="controls">
                   <form:input path="userName" onblur="checkIsExist();" onfocus="clearCss();" />
                   <site:required />
                   <span id="showResult"></span>
                <form-extension:errors path="userName" cssClass="error" />
               </div>
        </div>
</form:form>
<script type="text/javascript">
    function checkIsExist() {
        var userName = $.trim($("#userName").val());
        $.ajax({
            type:"POST",   //http请求方式
            url:"<spring:url value="/system/userprivilege/user/isExist" />", //发送给服务器的url
            data:"userName="+userName, //发送给服务器的参数
            dataType:"json",  //告诉JQUERY返回的数据格式(注意此处数据格式一定要与提交的controller返回的数据格式一致,不然不会调用回调函数complete)
            complete:function(msg) {
                if (eval("(" + msg.responseText + ")")) {
                    $("#showResult").html("<font color='red'>用户名已存在</font>");
                } else {
                    $("#showResult").html("");
                }
            }//定义交互完成,并且服务器正确返回数据时调用回调函数 
        });
    }
   function clearCss() {
       $("#showResult").html("");  
   }    
</script>

错误的例子(controller层)

@ResponseBody
@RequestMapping(value = "/user/isExist", produces = "application/json") 
public boolean isExist(Model model,String userName) {
    
    boolean flag = userPrivilegeServiceFacade
             .isExistUserName(userName);
        
    return flag;
}

优化的例子

controller层

@ResponseBody
@RequestMapping(value = "/user/isExist", produces = "application/json") 
public ResultDTO isExist(Model model,String userName) {
        
    ResultDTO result = new ResultDTO();
         
    boolean success = userPrivilegeServiceFacade
                 .isExistUserName(userName);
        
    result.setSuccess(success);
        
    if(success) {
        result.setMessage("<font color='red'>用户名已存在</font>");
    } else {
        result.setMessage("<font color='green'>用户名合法</font>");
    }
    return result;
}

domain层

public class ResultDTO implements Serializable{
    private static final long serialVersionUID = 1L;
    
    private  boolean success;
    private  String message;
    public boolean isSuccess() {
        return success;
    }
    public void setSuccess(boolean success) {
        this.success = success;
    }
    public String getMessage() {
        return message;
    }
    public void setMessage(String message) {
        this.message = message;
    }

}

jsp页面

<script type="text/javascript">

    function checkIsExist() {
        var userName = $.trim($("#userName").val());
        $.ajax({
            type:"POST",   //http请求方式
            url:"<spring:url value="/system/userprivilege/user/isExist" />", //发送给服务器的url
            data:"userName="+userName, //发送给服务器的参数
            dataType:"json",  //告诉JQUERY返回的数据格式(注意此处数据格式一定要与提交的controller返回的数据格式一致,不然不会调用回调函数complete)
            complete : function(msg) {
              var result = eval("(" + msg.responseText + ")");
              if(result.success) {
                  $("#showResult").html(result.message);
                } else {
                    $("#showResult").html(result.message);
                } 
           } 
        });
    }
   function clearCss() {
       $("#showResult").html("");  
   }    
</script>

 

posted @ 2015-11-23 16:31  星辰之力  阅读(1380)  评论(0编辑  收藏  举报