AJAX JSP displaying output data in a table

Question

trying to display data from server in the page in a table. but unfortunately it is not working. I can display it using out.println. Code samples are attached. Thank you very much.

ajax1 handles the ajax part and ajax2 is the file for java code.

...

  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>

............................................. .................................................

It's not working because you're not writing anything to the response. Also you're supposed to do this with a servlet. — Jonathan Laliberte
– Jonathan Laliberte, Commented Nov 14, 2018 at 13:54

Jonathan Laliberte · Accepted Answer · 2018-11-15 10:28:40Z

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

Remove java code from 2nd jsp and add it to a servlet called "AjaxServlet" with url mapping "/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.
    }

More info on how to do ajax with servlets here: How to use Servlets and Ajax?

Collectives™ on Stack Overflow

AJAX JSP displaying output data in a table

1 Answer 1

Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Linked

Related