这个javascript代码没有返回true

时间:2013-09-03 08:56:19

标签: javascript ajax

这是我的JavaScript代码

  function validatenewcat(){
        var category = document.getElementById("cat").value;
        if(category==""){
            setTimeout(document.getElementById("validate").innerHTML="!PLz Enter The Category Name", 2000);
            return false;
        }
    else{
        var url="catnamecheck.do?id="+category;
         xmlhttp.open("post", url,true);
         xmlhttp.onreadystatechange=(function (callback){
             return function (){
          if(xmlhttp.readyState==4){      
                 if(xmlhttp.status==200){   
                    var temp = xmlhttp.responseText;
                    obj = JSON.parse(temp);
                  if(obj.catgoryname==category){
                      alert("inside flase");
                     var validate = document.getElementById("validate");
                     validate.innerHTML="!PLz Enter The Unique Category Name";
                         callback(false); 
                     }
                 if(obj.catgoryname!=category){
                    alert("inside true");
                         callback(true);
                     }
                  }
              }
           }
         })(myCallback);
         xmlhttp.send(null);
        }
    }

任何人都可以请帮助我这个功能在这里没有返回true我使用ajax从javacode检查唯一的类别名称 这是我的回电功能

  function myCallback(returnedValue) {
        if (returnedValue) {
            alert("entered callback function");
            // true returned. Validation successful. Do whatever you want
            // here in this case.
        }
        else {
            // false returned. Validation failed. Handle the "false" scenario here
            alert("entered callback function");
        }
    }

这是我的jsp代码

<form name="frm" action="createnewcatgoryBean.jsp"  method="post" onsubmit="return validatenewcat()">
<table style="padding: 5px 0px 0px 8px;">
<tr>
<th colspan="2">
<div style="width: width:271px; color:red;" id="validate"></div>
</th>
</tr>
<tr>
<th>Category Name<span>:</span></th><td><input id="cat"  onblur="return validatenewcat()" type="text" name="category">
</td>
</tr>
<tr>
<th>Quotations form<span>:</span></th><td><input type="checkbox" name="quotations"></td>
</tr>
<tr>
<th>Agreement form<span>:</span></th><td><input type="checkbox" name="agreement"></td>
</tr>
<tr>
<th>Payment form<span>:</span></th><td><input type="checkbox" name="payment"></td>
</tr>
<tr>
<th>ETI<span>:</span></th><td><input type="checkbox" name="eti"></td>
</tr>
<tr>
<td colspan="2" style="float:right; padding-top:15px">
<input type="submit" value="Submit"  style="width: 60px;">
</td>
</tr>
</table>
</form>

任何人都可以告诉我如何返回成功或失败的回调函数这是我编辑的代码


这是我的javascript代码

function validatenewcat(){
        var category = document.getElementById("cat").value;
        if(category==""){
            setTimeout(document.getElementById("validate").innerHTML="!PLz Enter The Category Name", 2000);
            return false;
                 }
    else{
        var url="catnamecheck.do?id="+category;
         xmlhttp.open("post", url,true);
         xmlhttp.send(null);
         xmlhttp.onreadystatechange= function (){
          if(xmlhttp.readyState==4){      
                 if(xmlhttp.status==200){   
                    var temp = xmlhttp.responseText;
                    obj = JSON.parse(temp);
                   var unique = (obj.catgoryname != category);
                  if(unique ){
                      document.getElementById("newcatform").submit();
                             }
                  else{
                     var validate = document.getElementById("validate");
                     validate.innerHTML="!PLz Enter The Unique Category Name";
                       }
                  }
              }
           };
           return false;    
        }

这是我的jsp代码

<form id="newcatform" name="frm" action="createnewcatgoryBean.jsp"  method="post">
<table style="padding: 5px 0px 0px 8px;">
<tr>
<th colspan="2">
<div style="width: width:271px; color:red;" id="validate"></div>
</th>
</tr>
<tr>
<th>Category Name<span>:</span></th><td><input id="cat"  onblur="return validatenewcat()" type="text" name="category">
</td>
</tr>
<tr>
<th>Quotations form<span>:</span></th><td><input type="checkbox" name="quotations"></td>
</tr>
<tr>
<th>Agreement form<span>:</span></th><td><input type="checkbox" name="agreement"></td>
</tr>
<tr>
<th>Payment form<span>:</span></th><td><input type="checkbox" name="payment"></td>
</tr>
<tr>
<th>ETI<span>:</span></th><td><input type="checkbox" name="eti"></td>
</tr>
<tr>
<td colspan="2" style="float:right; padding-top:15px">
<input type="button" value="Submit" onclick="validatenewcat()"  style="width: 60px;">
</td>
</tr>
</table>
</form>
</div>

        }

1 个答案:

答案 0 :(得分:3)

onreadystatechange中的代码称为“event handler”,只有在POST操作完成后才会执行。这是validatenewcat函数在运行时实际执行的操作:

var category = document.getElementById("cat").value;
var url = "catnamecheck.do?id=" + category;
xmlhttp.open("post", url, true);
xmlhttp.send(null);
xmlhttp.onreadystatechange = (code to be called later)
return false; // <-- Always return false

您需要在onreadystatechange函数中移动需要 TRUE / FALSE 结果的代码,以便在HTTP操作完成后执行:

xmlhttp.onreadystatechange = function () {
    if (xmlhttp.readyState == 4) {
        if (xmlhttp.status == 200) {
            var temp = xmlhttp.responseText;
            obj = JSON.parse(temp);
            var unique = (obj.catgoryname != category);

            if (unique) {
                // Submit the form to the server
                document.getElementById("newcatform").submit();
            } else {
                document.getElementById("validate").innerHTML = "!PLz Enter The Unique Category Name";
            }
        }
    }
}

在JSP中,您可以在提交表单之前使用此功能验证您的类别:

<form id="newcatform" name="frm" action="createnewcatgoryBean.jsp" method="post">
...
<input type="button" value="Submit" onclick="validatenewcat()">
</form>

显然,一些重命名也是明智的。例如,“validatenewcat()”可能变为“validateandsend()”。

最后,为了避免计时问题,您应该在发送请求之前设置回调函数,因此在响应回来时它已经存在:

xmlhttp.open("post", url, true);
xmlhttp.onreadystatechange = function () {
    // ... callback code here ...
}
xmlhttp.send(null); // <- Move under onreadystatechange callback