onclick,load whole page instead of form

Question

I have two jsp page one is index.jsp another one is rest.jsp when Onclick function is clicked from index.jsp, jquery function is called to load rest.jsp page.

Instead of that I want to load the form present in rest.jsp,because bydefault ,the form value is taken null,instead of the value which is being entered by me.

Here are my index.jsp and rest.jsp Can somebody help me make to correct this? index.jsp

<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Support Console</title>
<script src="http://code.jquery.com/jquery-1.4.min.js" type="text/javascript"></script>
<script>
function load_home(e){
 e.preventDefault();
  var con = document.getElementById('conte');
  var xhr = new XMLHttpRequest();
  xhr.onreadystatechange = function(e) {
     if(xhr.readyState == 4 && xhr.status == 200) {
     con.innerHTML = xhr.responseText;
     }
     }
 xhr.open("GET","restsim.jsp", true);
xhr.setRequestHeader('Content-type', 'script');
xhr.send();
 }
</script>
 <script>
function changeContent() {
    $('#main').load('restsim.jsp');
}

function change() {
    $('#main').load('check.jsp');
}
</script>
</head>
<style>
#top {
    background-image: url('footer-bg.jpg');
    background-color: black;
    background-repeat: no-repeat;
    width: 1240Px;
    background-position: bottom;
    height: 100px;
    z-index: -10;
}

#left {
    background-color: orange;
    width: 200Px;
    height: 800Px;
    float: left;
}

#main {
    background-color: #EEEEEE;
    width: 1040Px;
    height: 800Px;
    position: absolute;
    left: 200px; //
    top: 192Px; //
    padding: 20px;
    overflow-y: auto;
}
#sup {
    border: 1Px Solid green;
    border-radius: 20px;
    margin: 5Px;
}
.tab_h {
    text-align: center;
    color: white;
    font-family: verdana;
    cursor: default;
    font-size: 20Px;
}
.linkmenu {
    text-decoration: none;
    color: white;
    margin: 15Px;
    font-family: verdana;
}

.linkmenu:hover {
    background-color: green;
    border-radius: 5px;
}
</style>
<body style='padding: 0Px; margin: 0Px;'>
   <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script type="javascript">
function toggleVisibility(f) {
        document.getElementById('footer').style.opacity = f;
    }
        </script>
<div id=top>
        <center>
            <span style='color: white; font-size: 200%; font-family: verdana;'><br>Application</span>
        </center>
    </div>


<div class=tab_h>Application</div>
<div id ="conte">
<a href="#" onclick="changeContent()" class=linkmenu >Check User</a><br>
<a href="#" onclick="change()" class=linkmenu>Check Sim</a><br>
<br>
</div>
</div>
</body>

rest.jsp

<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<%@ page import="java.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=ISO-8859-1">
<title>Application</title>
<style>input { border:none;  }
body 
    {
    font-family:Verdana;
    }
</style>

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js">
function xyz() {
    $('#get').load('rest.jsp');
}
</script>

</head>
<body>
    <div id="reset">
<span>Userid enter</span>
<br>Insert the user id:
<form id="get" name="get" onsubmit="return xyz(); return false;">
    <input type=hidden value=restsim.jsp name=page>
    <input type=hidden value=2 name=step> 
    <input style='border: 1Px solid black;' type=text name=userid><br>
    Or Email:<br>

    <input style='border: 1Px solid black;' type=text name=email> 
    <input value=go type=submit >

</form>
<%
        String userid = request.getParameter("userid");
        String email = request.getParameter("email");
        System.out.println("Userid::" + userid);
        int empty = 1;
        String query = null;

        if (userid != null && userid != ""){
            query = "select ssn,msisdn,status,product,owner from users.ui where owner="+userid+" or requestor="+userid+" order by product";
        }
        %>

    <%= request.getParameter("userid") %>
    <% 
        if (query != null ){
        ResultSet resultset = null;
        int cont = 0;
        try {
            Class.forName("oracle.jdbc.driver.OracleDriver");

        } catch (ClassNotFoundException e) {
            System.out.println("Where is your Oracle JDBC Driver?");
            e.printStackTrace();
            return;

        }
        System.out.println("Oracle JDBC Driver Registered!");
        Connection connection = null;
        try{
            connection = DriverManager.getConnection(
                    "jdbc:oracle:thin:@hostname:sid:connectionname", "username",
                    "password");
        }
        catch (SQLException e) {
            System.out.println("Connection Failed! Check output console");
            e.printStackTrace();
            return;

        }
        if (connection != null) {
            System.out.println("You made it, take control your database now!");
            Statement statement = connection.createStatement() ;
            //resultset = statement.executeQuery("select  firstname , lastname from users where id = 9 ") ;
            System.out.println ("Query ::" + query);
                resultset = statement.executeQuery(query);
        } else {
            System.out.println("Failed to make connection!");
        }
    %>
    <% 
        int status = 0;
        String ssn = ""; 
        while(resultset.next()){
        cont++;
        ssn = resultset.getString(1);
        String msisdn = resultset.getString(2);
        status = resultset.getInt(3);
        if (ssn != "" && ssn != null && msisdn != "" && msisdn != null){
            empty = 0;
        }   
    %>
        <table border=1><tr><td colspan=6 style=background-color:orange><b><i>USER DATA:</i></b></td></tr>
            <tr><td style=background-color:green;color:white;><b>USER ID</b></td>
                </b></td></tr>
            <tr>
                <td><%=userid %></td>
                <td><%= resultset.getString(5) %></td>
                <td><a href="check.jsp&step=2&phonenumber=<%=phone%>"><%=phone%></a></td>
                <td><a href="check.jsp&step=1&number=<%=number%>&number=<%=number%>"><%=number%></a></td>
                <td><%=status %></td>
                <td><%=resultset.getString(4) %></td>
            </tr>
    <% } 
        if (cont == 0) {%>
            <tr><b><i>There are no rows for this query.</i></b></tr>
    <% } 
        if (status != 2 | ssn != ""){

        }
     }%>
</div>
</body>
</html>

Answer 1

Create your function in a separate script tag and make change on form as the following.

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script>
    function xyz() {
        $('#get').load('rest.jsp');
    }
</script>

    <form id="get" name="get" onsubmit="xyz(); return false;">

onclick,load whole page instead of form

Question

1 answers

solution1
0 2015-09-08 07:27:08

onclick,load whole page instead of form

Question

1 answers

solution1 0 2015-09-08 07:27:08

solution1
0 2015-09-08 07:27:08