Retrieve data from database based on input form

Question

I tried to retrieve a data from database. I used jdbc to connect to the database. I have a text field and a submit button. When I type the text in the textfield and click submit, it shows a blank page and there is no error in the console . I didn't get the data from the database.my database name is new and table name is list. Any solution for this?

             <!DOCTYPE html>
                  <html>

                  <head>
                    <title>D3</title>
                    <script>
                      function getData() {
                        {
                          xmlHttp = GetXmlHttpObject();
                          var id = document.getElementById("input").value;
                          var url = "main.jsp"; 
                          url = url + "?input=" + id;
                          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("input").value
                         = showdata;

                          }
                        }
                      }
                    </script>
                  </head>

                  <body>
                    <div id="type">
                      <form>
                        <table>
                          <tr>
                            <td>
                              <input type="text" name="input">
                            </td>
                          </tr>
                          <tr>
                            <td>
                              <input type="submit" 
                name="submit" onclick="getdata();" </td>
                          </tr>
                        </table>
                      </form>
                    </div>
                  </body>

                  </html>

below is the main.jsp file used to get data from the database based on the input form

main.jsp

          <%@page import="java.sql.ResultSet"%>
        <%@page import="java.sql.*"%>
        <%@page import="java.sql.DriverManager"%>
        <%@page import="java.sql.Connection"%>
        <%@page import="java.beans.Statement"%>
        <%
            String ch = request.getParameter("type").toString();
            System.out.println(ch);
            String data ="";
            try{
                Class.forName("com.mysql.jdbc.Driver");
                Connection con=DriverManager.getConnection
           ("jdbc:mysql://localhost:3306/new","root","admin321"); 
               PreparedStatement st=con.prepareStatement
          ("select * from list where input in name=?");



              ResultSet rs=st.executeQuery(); 


                while(rs.next())
                {
                    data = rs.getString("name") + ": " +
              rs.getString("child name");
                }
                out.println(data);
                System.out.println(data);
            }
            catch(Exception e) {
                System.out.println(e);
            }
        %>

updated script:

           function getData(){ 
              {
            xmlHttp=GetXmlHttpObject();
             var id=document.getElementById("input").value;
         var url="main.jsp";
     //  java.net.URLEncoder.encode(url, "UTF-8");
      //  url=URLEncoder.encode(url,"UTF-8");
         url=url+"?input="+id;


       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("input").value=showdata;

      }
     } 
      return false;
       }

score 0 · Answer 1 · answered Dec 22 '16 at 08:25

The form is making an action, even if you didn't specify it. You should prevent the default event (get of a new page) from happening, or specify that you want to POST data instead of GET.

I am unsure if this is the actual answer but there's a chance this will solve your problem. Use client-side javascript to prevent the form action from happening. An example using jQuery:

($(document).ready(function(){
$(".your-form").submit(function(e){
   // e stands for the event generated by the submit
   e.preventDefault();
   // the rest of your logic
   });
  });
)();

vishnuvp · Answer 2 · 2016-12-22T09:13:51.130

0

I could find the following issues with your code.

I could not find anywhere in the jsp code where you set values for the 'name' attribute after the prepared statement.
The String ch = request.getParameter("type").toString(); gets the value of type parameter. However in the line url = url + "?input=" + id; you are setting the input parameter.
There is no return false at the of the getdata() to prevent form submit. Add return false; to the end of the getdata() function Try solving the above issues and check if you are still not getting the desired output.

edited Dec 22 '16 at 09:13

answered Dec 22 '16 at 08:30

vishnuvp

283
5
20

still the page is blank – preetha Dec 22 '16 at 08:40
Set the parameter for the prepared statement as well. Let me know if it works. – vishnuvp Dec 22 '16 at 08:41
st.setString(1, ch); – vishnuvp Dec 22 '16 at 08:44
it results in blank page – preetha Dec 22 '16 at 08:48
submit button take me to this url http://localhost:8080/WebApplication6/index.jsp?input=%26%232949%3B%26%232965%3B%26%232994%3B%26%233021%3B&submit=Submit is the problem is here? – preetha Dec 22 '16 at 08:57
As mentioned in @mnemosdev's answer, prevent the default action of form submit. Add a return false at the end of `getdata()` function. – vishnuvp Dec 22 '16 at 09:05
thanks for your suggestion.i try the things you suggest but page remains blank.i add the updated script above..plz check. – preetha Dec 22 '16 at 10:21
Sorry. I think my comment confused you a lot. In the previous code strip just add `return false;` at the end of getdata() code and try. – vishnuvp Dec 22 '16 at 11:23
when i compile and run there is no error..but when i debug the file it shows the error as fails access denied to manger. – preetha Dec 22 '16 at 14:04
Can you please tell at which point the error is showing. Is it at the line where you create the jdbc connection? Also, what is 'manger'? Is it a database user? – vishnuvp Dec 22 '16 at 20:04
this is the error when i debug main.jsp C:\Users\admin\Documents\NetBeansProjects\WebApplication6\nbproject\build-impl.xml:1155: Deployment error: Access to Tomcat server has not been authorized. Set the correct username and password with the "manager-script" role in the Tomcat customizer in the Server Manager. See the server log for details. – preetha Dec 23 '16 at 04:34
in index jsp debug -java.util.logging.ErrorManager: 4 java.io.FileNotFoundException: C:\Program Files\Apache Software Foundation\Tomcat 8.5\logs\localhost.2016-12-23.log (Access is denied) this is part of my error ..if required i will post whole error..and when i open a manager on local host it shows 403 error without even ask me to type the password... – preetha Dec 23 '16 at 04:34
whenever I click on that Manager App button it doesn't even bring up the username/password box it just goes straight to the 403 page – preetha Dec 23 '16 at 04:40
Sorry for the late response. Please check this post: http://stackoverflow.com/questions/10241539/access-to-tomcat-server-has-not-been-authorized – vishnuvp Jan 03 '17 at 06:37

Retrieve data from database based on input form

2 Answers2