in the below we are populating names in the dropdown, once dropdown value changes, we need to print the correponding firstname,lastname,address,loginid in the textbox. this what we need to achieve
This is my jsp code.
<% DBConnection dbc=new DBConnection();
Connection con=dbc.getNewConnection();
Statement st = null;
ResultSet rs = null;
try
{
st=con.createStatement() ;
rs=st.executeQuery("select * from Users");
%>
<select id="selectBox" >
<% while(rs.next()){ %>
<option><%= rs.getString(2)%></option>
<%} %>
</select>
<input id="loginid" type="text" value="" />
<input id="firstname" type="text" value="" />
<input id="lastname" type="text" value="" />
<input id="address" type="text" value="" />
So how to populate above 4 values based on selected name from the Users table.
Please help me how to write Javascript function to do that.
You first need to write onchange
event handler so whenever select-box value gets changes this
handler will get called and then send the value of select
to backend page(servlet) .So, ajax code will look like below :
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
$('select#selectBox').on('change', function() {
var value = $(this).val(); //get value from select-box
$.ajax({
type: 'POST',//can be post request or get
url: url,//put url here where you need to send
data: {
'value': value//pass value
},
success: function(response) {
//result will come here
//if recieve as html use
$("somedivclass").html(response)
//if recieve as separted commas
var result = response.split(",")
//access same using result[0],result[1] ..etc
//add value to input using
$("#loginid").val(result[0]);
//same for other
}
});
})
At your server end get that value which is passed from ajax using request.getParameter("value")
inside doPost
method of ajax if making POST
request.Then ,simply write your query to retrieve record from db and send back same to ajax .So , your code will look like somewhat below :
String value = (String) request.getParameter("value");
String query = "select * from Users where yourcolumnanemtocompare=?";
PreparedStatement ps = con.prepareStatement(query);
ps.setString(1, value);
ResultSet rs = ps.executeQuery();
//if value there
String text;
if (rs.next()) {
//change value accordingly..i.e : rs.getstring..
text = "<input id=" + loginid " type="
text " value=" + rs.getInt(1) + " /><input id="
firstname " type="
text " value=" + rs.getInt(2) + " /> <input id="
lastname " type="
text " value=" + rs.getInt(3) + " /><input id="
address " type="
text " value=" + rs.getInt(4) + " />";
}
response.setContentType("text/html"); // Set content type
response.setCharacterEncoding("UTF-8");
response.getWriter().write(text); // response to send back.
//or
if (rs.next()) {
//change value accordingly..i.e : rs.getstring..
text = rs.getInt(1) + "," + rs.getInt(2) + "," + rs.getInt(3) + "," + rs.getInt(4);
}
response.setContentType("text/plain"); // Set content type
response.setCharacterEncoding("UTF-8");
response.getWriter().write(text); // response to send back..
//or use json to send data..
It Worked.., Thank you for help!..