Question

我正在使用Ajax在JSP中开发代码来验证DB中的用户（意味着有一个输入框，用户提供电子邮件ID，然后代码检查用户是否存在使用ajax），如果用户不存在DB然后用户不应该提交表单。在下面的代码中，Ajax正在工作。它根据从JSP用户检查文件（user_exist_function.jsp）返回显示true / false但是如果DB上不存在用户，我无法控制用户停止提交。请帮忙。

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()），但它真的没什么意义。

更新：
我注意到我把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();                    
        } );

}

如果数据库中不存在用户，请停止提交表单

1 个答案: