如何在不重新加载JSP页面的情况下从数据库中检索值

时间:2016-03-28 21:13:08

标签: jquery ajax database jsp

我想知道如何在不重新加载页面的情况下从数据库中检索值。我只知道一点javascript,我使用data source jndi作为我的数据库。我目前正在关注MVC2模型。

<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
pageEncoding="ISO-8859-1"%>
<%@page import = "java.sql.*" %>
<%@page import = "javax.sql.*" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script src="https://code.jquery.com/jquery-1.10.2.js"></script>
<script>
    $(document).ready(function(){
        $( "button" ).click(function() {
            $("#users").change(function(){ //A function to execute each time the event is triggered.
                var value = $(this).val(); //allows you to pass an array of element values   
                $.get("index.jsp",{q:value},function(data){
                    $("#javaquery").html(data);
                });
            });
        });
    });
</script>
</head>
<body>
    <div id="users">
        <button value="1">1</button>
        <button value="2">2</button>
    </div>
    <br />
    <div id="javaquery"><b>Name will be displayed here</b></div>
<%
    String name = "";
    String q = request.getParameter("q");
    try {
        Class.forName("net.sourceforge.jtds.jdbc.Driver");
        Connection con = DriverManager.getConnection("jdbc:jtds:sqlserver://192.168.0.14:1433/demolangako", "demolangme", "demolangme");
        Statement smt = con.createStatement(); //Create Statement to interact
        ResultSet r = smt.executeQuery("select * from users where(id='" + q + "');");
        while (r.next()) {
            name = r.getString("name");
        }
        con.close();
    } catch (Exception e) {
        e.printStackTrace();
    }
 %>
Name:<%out.print(name);%>

</body>
</html>

目前我有这个代码,但它不适用于我的按钮。任何帮助表示赞赏。

2 个答案:

答案 0 :(得分:0)

首先,您必须在单独的文件中拥有数据库访问代码(仅限java),该文件将提供index.jsp的ajax请求。

第二点是,你需要修改你的jQuery脚本。由于您要将按钮单击值发送到ajax,请尝试此操作。

$("button").click(function() {
  $.get("jdbc.jsp", {
    q: $(this).val()
  }, function(data) {
    $("#javaquery").html(data);
  });
});

答案 1 :(得分:0)

请避免在jsp文件中编写java代码。您可以从How to avoid Java code in JSP files?找到简要说明BalusC

请阅读MVC2 pattern。如果您正在使用MVC2,它应该在业务和视图之间有明确的隔离。

首先,我们应该创建简单的B apply(A input)结构。你可以找到我的答案Creating a simple web page using servlet。完成上述部分后,

为此,您可以使用jsp-servlet。既然你已经使用了ajax,我就会解释一下。请记住导入jQuery-ajax库。

您的jquery应该是这样的,当您在文本框中输入值时我有一个文本框和按钮,然后单击提交它应该通过servlet到达数据库并返回结果而不重新加载页面。我正在向index.jsp发送请求,如我的示例所示。

HelloServlet

在你的servlet中,

<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
pageEncoding="ISO-8859-1"%>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Submit and View Page</title>
<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
<script>
$(document).ready(function(){
  $("#newsubmit").click(function(e){
    $.ajax({
        type: "POST",
        url: "HelloServlet",
        data: { name: $("#myname").val() },
        success:function(result){
            alert(result);
        }
    });
  });
});
</script>
</head>
<body>
     <form>
        <label>Name: </label><input type='text' id="myname" name='name'/></br>
        <input type="button" id="newsubmit" value="Submit" />
    </form>
</body>
</html>

现在你将收到ajax的回复。希望这会有所帮助。