
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>

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
)
If you are facing any programming issue, such as compilation errors or not able to find the code you are looking for.
Ask your questions, our development team will try to give answers to your questions.