Latest Tutorials| Questions and Answers|Ask Questions?|Site Map



Home Answers Viewqa JavaScriptQuestions how to display jsp page containing mysql query in particular division using ajax ?my code is below bt i cundt get it properly
Login         

View Questions and Answers by Category

Advertisements


 
Have Programming Question? Ask it here!
 
 
 


virti shah
how to display jsp page containing mysql query in particular division using ajax ?my code is below bt i cundt get it properly
1 Answer(s)      2 years and 7 months ago
Posted in : JavaScript Questions


index.html
   <!--
To change this template, choose Tools | Templates
and open the template in the editor.
-->
<!DOCTYPE html>
<html>
    <head>
        <title></title>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    </head>

  <script language="javascript" type="text/javascript">
function diplayFunction(){
    var request;  // The variable that makes Ajax possible!

    try{
        // Opera 8.0+, Firefox, Safari
        request = new XMLHttpRequest();
    } catch (e){
        // Internet Explorer Browsers
        try{
            request = new ActiveXObject("Msxml2.XMLHTTP");
        } catch (e) {
            try{
                     request = new ActiveXObject("Microsoft.XMLHTTP");
            } catch (e){
                // Something went wrong
                alert("Your browser broke!");
                return false;
            }
        }
    }

    request.open("GET", "newjsp.jsp", true);

    // Create a function that will receive data sent from the server
    request.onreadystatechange = function(){
        if(request.readyState == 4 && request.status==200){
            var ajaxDisplay = document.getElementById('ajaxDiv');
            ajaxDisplay.innerHTML = request.responseText;
        }
    }


    request.send(null); 
}

//-->
</script>

<body>

    <form name="myform">

  <p>
      </br>
      </br>


  <label> Enter Employee name:</label>
  <input  name="ename" id="ename" type="text" size="30" maxlength="30" /></br>
  </p>
  <p >
     <input type="button" onclick="displayFunction()" value="submit" />
  </p>

</form>
<div id="ajaxDiv">Your result will display here</div>
    </body>
</html>


print("code sample");
newjsp.jsp




<!--
To change this template, choose Tools | Templates
and open the template in the editor.
-->
<!DOCTYPE html>
<html>
    <head>
        <title></title>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    </head>

  <script language="javascript" type="text/javascript">
function diplayFunction(){
    var request;  // The variable that makes Ajax possible!

    try{
        // Opera 8.0+, Firefox, Safari
        request = new XMLHttpRequest();
    } catch (e){
        // Internet Explorer Browsers
        try{
            request = new ActiveXObject("Msxml2.XMLHTTP");
        } catch (e) {
            try{
                     request = new ActiveXObject("Microsoft.XMLHTTP");
            } catch (e){
                // Something went wrong
                alert("Your browser broke!");
                return false;
            }
        }
    }

    request.open("GET", "newjsp.jsp", true);

    // Create a function that will receive data sent from the server
    request.onreadystatechange = function(){
        if(request.readyState == 4 && request.status==200){
            var ajaxDisplay = document.getElementById('ajaxDiv');
            ajaxDisplay.innerHTML = request.responseText;
        }
    }


    request.send(null); 
}

//-->
</script>

<body>

    <form name="myform">

  <p>
      </br>
      </br>


  <label> Enter Employee name:</label>
  <input  name="ename" id="ename" type="text" size="30" maxlength="30" /></br>
  </p>
  <p >
     <input type="button" onclick="displayFunction()" value="submit" />
  </p>

</form>
<div id="ajaxDiv">Your result will display here</div>
    </body>
</html>

Advertisement
View Answers

March 21, 2012 at 12:00 PM


1)selectname.jsp:

<html>
<head>
<script type="text/javascript">
function showEmp(emp_value){ 
 if(document.getElementById("address").value!="-1"){
 xmlHttp=GetXmlHttpObject()
if (xmlHttp==null){
 alert ("Browser does not support HTTP Request")
 return
 }
var url="getvalue.jsp"
url=url+"?name="+emp_value
xmlHttp.onreadystatechange=stateChanged 
xmlHttp.open("GET",url,true)
xmlHttp.send(null)
}
else{
 alert("Please Select Employee Id");
}
}
function stateChanged(){ 
document.getElementById("email").value ="";
document.getElementById("address").value ="";
if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete") { 
var showdata = xmlHttp.responseText; 
    var strar = showdata.split(":");
if(strar.length==1){
  document.getElementById("address").focus();
  alert("Please Select Employee Id");
  document.getElementById("email").value =" ";
document.getElementById("address").value =" ";
 }
 else if(strar.length>1) {
var strname = strar[1];
document.getElementById("address").value= strar[1];
document.getElementById("email").value= strar[2];
 }
 } 
}

function GetXmlHttpObject(){
var xmlHttp=null;
try{
 xmlHttp=new XMLHttpRequest();
 }
catch (e) {
 try {
  xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
  }
 catch (e)  {
  xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
 }
return xmlHttp;
}
</script>
</head>
<body>
<form name="employee">
<br><br>
<table border="0" width="400px" align="center" bgcolor="#CDFFFF">
<div id="mydiv"></div>
   <tr><td><b>Select Employee Name</b></td><td> 
   <select name="name" onchange="showEmp(this.value);">
   <option value="-1">Select</option> 
<option value="Angelina">Angelina</option>
<option value="Martina">Martina</option>
<option value="Julia">Julia</option>
<option value="Angel">Angel</option>
 </select>
</td></tr>
<tr><td ><b>Employee Address:</b></td><td>
<input  type="text" name="address" id="address" value=""></td></tr>
<tr><td><b>Employee Email:</b></td><td>
<input  type="text" name="email" id="email" value=""></td></tr>

</table>
</form>    
<table border="0" width="100%" align="center">
<br>
<br>
</table>
</body>
</html>

2)getvalue.jsp:

<%@page import="java.sql.*"%>
<%
String emp_name = request.getParameter("name").toString();
String data="";
Connection conn = null;
String url = "jdbc:mysql://localhost:3306/";
String dbName = "test";
String driver = "com.mysql.jdbc.Driver";
String userName = "root"; 
String password = "root";

int sumcount=0; 
Statement st;
try {
Class.forName(driver).newInstance();

conn = DriverManager.getConnection(url+dbName,userName,password);
String query = "select * from employee where name='"+emp_name+"'";

st = conn.createStatement();
ResultSet rs = st.executeQuery(query);
while(rs.next())
{
data = ":" + rs.getString("address") +":"+  rs.getString("email");
}
out.println(data);
}
catch (Exception e) {
e.printStackTrace();
}
%>

3)For the above code, we have created following table:

CREATE TABLE `employee` (               
            `id` bigint(255) default NULL,        
            `name` varchar(255) default NULL,     
            `address` varchar(255) default NULL,  
            `contactNo` int(255) default NULL,    
            `email` varchar(255) default NULL     
          )


Related Tutorials/Questions & Answers:
Advertisements
 

 

 

DMCA.com