AJAX JSP在表中显示输出数据

时间:2018-11-14 12:46:23

标签: html ajax jsp

尝试在表格的页面中显示来自服务器的数据。但不幸的是它没有用。我可以使用out.println显示它。附有代码示例。非常感谢。

ajax1处理ajax部分,而ajax2是Java代码的文件。

...

  Ajax1.jsp
<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(){
                 $("#users").change(function(){
                     var value = $(this).val();
                     $.get("ajax2.jsp",{q:value},function(data){
                      $("#javaquery").html(data);
                     });
                 });
             });
        </script>
    </head>
    <body>
        <select id = "users">
           <option value="">Select Account ID</option>
           <option value="calicut">calicut</option>
           <option value="kochi">kochi</option>
                      <option value="Admin">Admin</option>

        </select>
        <br />
        <div id="javaquery"><b>Name will be displayed here</b></div>
    </body>
</html>


Ajax2.jsp

<%@page import="java.text.SimpleDateFormat"%> 
<%@page contentType="text/html" pageEncoding="UTF-8"%> 
<%@page import="java.util.*,java.sql.*,java.io.*" %>
<%@page import="javax.servlet.*" %> 
<%@page import="javax.servlet.http.*" %> 
<%@ page import="java.sql.*" %>
<%@ page import="java.util.*" %>
<%@ page import="java.io.*" %>
<%@ page import="javax.sql.*" %>
<%@ page import="javax.naming.*,javax.swing.*,java.sql.Date.*,java.text.SimpleDateFormat.*,java.util.Date.*" %>
<html> <head> <meta http-equiv="Content-Type" 
                    content="text/html; charset=UTF-8"> <title></title> </head>
    <body> 


        <%

        InitialContext ctx;
       DataSource ds;
       Connection conn;
       ResultSet rs;
       Statement stmt;

 String name = "";
 String ename="";

    try {

        ctx=new InitialContext();
       ds=(DataSource) ctx.lookup("java:app/jdbc/SalesDB");
       conn=ds.getConnection();







   String q = request.getParameter("q");

        stmt = conn.createStatement(); //Create Statement to interact
      rs = stmt.executeQuery("select * from employees where Username='"+q+"'");
        while (rs.next()) {
          name = rs.getString("Role_")+rs.getString("username");
          ename=rs.getString("username");
        }
        rs.close();
        stmt.close();
        conn.close();
   } catch (Exception e) {
        e.printStackTrace();
   }
%>
Name:<%out.print(name);%>
eName:<%out.print(ename);%>

  </body> </html> 

................................................... .................................................. < / p>

1 个答案:

答案 0 :(得分:1)

   <script>
        $(document).ready(function(){
             $("#users").change(function(){
                 var value = $(this).val();
                 $.get("AjaxServlet",{q:value},function(data){
                  $("#javaquery").html(data);
                 });
             });
         });
    </script>

从第二个jsp中删除Java代码,并将其添加到具有URL映射“ / AjaxServlet”的servlet“ AjaxServlet”

AjaxServlet:

    @Override
    protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
       String q = request.getParameter("q"); //q value



     InitialContext ctx;
       DataSource ds;
       Connection conn;
       ResultSet rs;
       Statement stmt;

 String name = "blank name";
 String ename="";

    try {

        ctx=new InitialContext();
       ds=(DataSource) ctx.lookup("java:app/jdbc/SalesDB");
       conn=ds.getConnection();







   String q = request.getParameter("q");

        stmt = conn.createStatement(); //Create Statement to interact
      rs = stmt.executeQuery("select * from employees where Username='"+q+"'");
        while (rs.next()) {
          name = rs.getString("Role_")+rs.getString("username");
          ename=rs.getString("username");
        }
        rs.close();
        stmt.close();
        conn.close();
   } catch (Exception e) {
        e.printStackTrace();
   }



        response.setContentType("text/plain");  // Set content type of the response so that jQuery knows what it can expect.
        response.setCharacterEncoding("UTF-8"); // You want world domination, huh?
        response.getWriter().write(name);       // Write response body.
    }

有关如何使用servlet执行ajax的更多信息,请参见: How to use Servlets and Ajax?