如果用戶不存在於數據庫中，請停止提交表單

Question

我正在使用Ajax在JSP中開發代碼以驗證數據庫中的用戶（表示有一個輸入框，其中用戶提供電子郵件ID，然後代碼檢查用戶是否存在或不存在使用ajax），如果用戶不在數據庫中，則用戶不應該能夠提交表單。在下面的代碼中，Ajax正在工作。它根據從JSP用戶檢查文件（user_exist_function.jsp）返回來顯示true/false，但如果用戶不存在於數據庫上，則無法控制用戶停止提交。請幫忙。

JS

var MyApp = {}; 

function check() { 
    xmlHttp = GetXmlHttpObject() 
    var url = "user_exist_function.jsp"; 
    value = document.getElementById('email1').value; 
    url = url + "?username=" + value; 
    xmlHttp.onreadystatechange = stateChanged 
    xmlHttp.open("GET", url, true) 
    xmlHttp.send(null) 
} 

function stateChanged() { 
    if (xmlHttp.readyState == 4 || xmlHttp.readyState == "complete") { 
    var showdata = xmlHttp.responseText; 
    document.getElementById("mydiv").innerHTML = showdata; 

    MyApp.status = showdata; 

    } 
} 

function GetXmlHttpObject() { 
    var xmlHttp = null; 
    try { 
    xmlHttp = new XMLHttpRequest(); 
    } catch (e) { 
    try { 
     xmlHttp = new ActiveXObject("Msxml2.XMLHTTP"); 
    } catch (e) { 
     xmlHttp = new ActiveXObject("Microsoft.XMLHTTP"); 
    } 
    } 
    return xmlHttp; 
} 

function check_submit() { 
    var var1 = MyApp.status.valueOf().toLocaleString(); 


    if (var1 == 'true') { 
    return false; 
    } else { 
    return true; 
    } 
} 

HTML

<form name="form" onsubmit="return check_submit();"> 
    Email Id: <input type="text" name="email" id="email1" onkeyup="check();"> 
    <font color="red"> 
    <div id="mydiv"></div> 
    </font> 
    <input type="submit"> 
</form> 

user_exist_function.jsp

<%@page import="java.sql.*" %> 
<%@include file="Database_connectivity.jsp" %> 

<%@page contentType="text/html" pageEncoding="UTF-8"%> 
<% 
    try{ 
      String username = request.getParameter("username").toString(); 
      PreparedStatement ps = conn.prepareStatement("SELECT * FROM V_USER_DATA WHERE " + 
        "EMAIL = ?"); 
      ps.setString(1,username); 

      ResultSet res = ps.executeQuery(); 


      if(res.next()) 
      { 
       out.println("false"); 
      } 
      else 
      { 
       out.println("true"); 
      } 

     }catch (Exception e){ 
      out.println(e); 
     } 
%> 

Answer 1

<input id="Mysubmit" type="submit"> 
    <span id="msgNotInDB" style="display:none">You are not in the database</span> 


     if(res.next()) 
     { 
      $("#Mysubmit").hide(); 
      $("#msgNotInDB").show(); 
     } 
     else 
     { 
      $("#Mysubmit").show(); 
      $("#msgNotInDB").hide(); 
     } 

注：這個答案使用jQuery，因爲任何明智的企圖在網頁上使用AJAX將使用jQuery（或至少一個類似的庫）。我所展示的內容可以在沒有它的情況下完成（使用document.getElementById()），但其中沒有多少意義。

UPDATE：
我注意到，我把jQuery代碼在服務器端代碼。所以，讓我們擴展我們的重寫。這應該替換所有給定的Javascript：

function check() 
{ 
    $.get("user_exist_function.jsp", {username: $("email").val()}, 
    function(data) { 
     if (data) { 
      $("#Mysubmit").show(); 
      $("#msgNotInDB").hide(); 
     } else { 
      $("#Mysubmit").hide(); 
      $("#msgNotInDB").show();      
     }); 

}