Table data:
create table emp(eid varchar(20) primary key,ename varchar(20),sal varchar(20),address varchar(20));
->select * from emp;
step1: Develop a index.jsp page and write a ajax code as shown in below..
<!DOCTYPE html>
<html>
<head>
<script>
function showCustomer(str)
{
var xmlhttp;
if (str=="")
{
document.getElementById("txtHint").innerHTML="";
return;
}
if (window.XMLHttpRequest)
{// code
for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code
for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if
(xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("div1").innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open("GET","retrieve.jsp?q="+str,true);
xmlhttp.send();
}
</script>
</head>
<body>
<select name="eid"
onchange="showCustomer(this.value)">
<option>..select..</option>
<option
value="1">1</option>
<option
value="2">2</option>
<option
value="3">3</option>
<option
value="4">4</option>
<option
value="5">5</option>
</select>
<br>
<div id="div1">..Employee info
Dispalyed here..</div>
</body>
</html>
<%@page import="java.sql.ResultSet"%>
<%@page import="java.sql.PreparedStatement"%>
<%@page import="java.sql.DriverManager"%>
<%@page import="java.sql.Connection"%>
<%@page import="java.sql.Connection"%>
<%
try{
String eid=request.getParameter("q");
Class.forName("com.mysql.jdbc.Driver");
Connection con=DriverManager.getConnection("jdbc:mysql://localhost:3306/ashok","root","root");
PreparedStatement pstmt=con.prepareStatement("select * from emp where eid=?");
pstmt.setString(1,eid);
ResultSet rs=pstmt.executeQuery();
if(!rs.next()){
out.println("no records.");
}
else{
%>
<TABLE>
<TR>
<td>EID:</td>
<td>Ename:</td>
<td>Salary:</td>
<td>Address:</td>
</tr
<tr>
<td><input type="text" name="" value="<%=rs.getString(1)%>"></td>
<td><input type="text" name="" value="<%=rs.getString(2)%>"></td>
<td><input type="text" name="" value="<%=rs.getString(3)%>"></td>
<td><input type="text" name="" value="<%=rs.getString(4)%>"></td>
</tr>
</TABLE>
<%
}
}catch(Exception e){
}
%>
<%@page import="java.sql.PreparedStatement"%>
<%@page import="java.sql.DriverManager"%>
<%@page import="java.sql.Connection"%>
<%@page import="java.sql.Connection"%>
<%
try{
String eid=request.getParameter("q");
Class.forName("com.mysql.jdbc.Driver");
Connection con=DriverManager.getConnection("jdbc:mysql://localhost:3306/ashok","root","root");
PreparedStatement pstmt=con.prepareStatement("select * from emp where eid=?");
pstmt.setString(1,eid);
ResultSet rs=pstmt.executeQuery();
if(!rs.next()){
out.println("no records.");
}
else{
%>
<TABLE>
<TR>
<td>EID:</td>
<td>Ename:</td>
<td>Salary:</td>
<td>Address:</td>
</tr
<tr>
<td><input type="text" name="" value="<%=rs.getString(1)%>"></td>
<td><input type="text" name="" value="<%=rs.getString(2)%>"></td>
<td><input type="text" name="" value="<%=rs.getString(3)%>"></td>
<td><input type="text" name="" value="<%=rs.getString(4)%>"></td>
</tr>
</TABLE>
<%
}
}catch(Exception e){
}
%>
output:
click here for (WAR) DOWNLOAD Here
pengaruh w3cschools.com aja,saya sudah mampir di blog2 yang lain tapi sama aja.
ReplyDeletewowwwwwwwwww
ReplyDeleteNIce So Simple to Understand...Keep Going All the Bset...Ashok Kumar..;)
ReplyDeletethank u man... expecting more advanced tutorial about ajax from u... very good tutorial.. hats-off to Ashok Kumar
ReplyDeleteI agree with you in this, but there is a question. What about when you want to load different records in the same form but different rows? For example the employee data you have loaded (you selected EID to load the employee data), you want assign this employee some job by selecting JOBID. How can you load both data at the same time?
ReplyDeleteHelp plz
I can be reached on jackjuma12@gmail.com
really nice review,helped alot.thanks mate !
ReplyDeleteYa,its working fine ...nd without loading on entire page...
ReplyDeleteIt's not working for ke
ReplyDeleteWhen u select an option ut doesn't work