sanrich
asked on
How to disolay selected value in JSP dynamically
Hi,
I have two display grid in my JSP page- WorkForcememberIDSearch and WorkForcememberIDSearchHis tory.
When ever user select the data using radio button in WorkForcememberIDSearch, based on that I have query database and display values based on the result from DB. Please provide me a sample how can I do this? I am enclosing html page html code please let me know if jsp page is needed.
I have two display grid in my JSP page- WorkForcememberIDSearch and WorkForcememberIDSearchHis
When ever user select the data using radio button in WorkForcememberIDSearch, based on that I have query database and display values based on the result from DB. Please provide me a sample how can I do this? I am enclosing html page html code please let me know if jsp page is needed.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Workforce Member Screen</title>
<link href="../css/TM_Styles.css" type="text/css" rel="stylesheet" />
<link href="../css/TM_Styles_2.css" type="text/css" rel="stylesheet" />
<script type="text/javascript">
var formInUse = false;
function setFocus()
{
if(!formInUse) {
document.add.lname.focus();
}
}
</script></head>
<body onload="setFocus()">
<form action="XXXXXX" method="post" name="add" target="_self">
<table width="100%" border="0" align="center" cellpadding="0" cellspacing="0" class="outertblborder">
<tr class="tableheading" >
<td height="25" nowrap="nowrap" colspan="5">
<strong> <span class="outtblheading">LTC TrainingRecords Manager</span></strong>
<strong> - Workforce Members Screen</strong>
<span class="outtblheading">
User - </span>
<input name="username" type="hidden" value="" />
</td>
</tr>
<tr>
<td width="8" > </td>
<td width="544" height="369" align="center">
<table width="97%" border="0" cellpadding="0" cellspacing="0" class="innertableborder tableborder">
<tr>
<td height="28" colspan="3" class="tableheading"><p><strong>Workforce Member ID Search</strong></p></td>
</tr>
<tr>
<td height="28" width="54%" nowrap="nowrap" align="left"> <span class="loginfont">
<strong>Last Name </strong></span>
<span class="error">(type part or all of a last name)</span> </td>
<td width="46%" nowrap="nowrap">
<span class="loginfont"><strong>Workforce ID</strong></span>
<span class="error"> (type in part or all of an ID)</span> </td>
</tr>
<tr>
<td height="28" align="left"> <input type="text" name="lname" id="lname" tabindex="1" maxlength="25"/></td>
<td><input type="text" name="workfid" id="workfid" tabindex="3" maxlength="10" /></td>
</tr>
<tr>
<td height="28" width="54%" nowrap="nowrap" align="left"> <span class="loginfont">
<strong>First Name </strong></span>
<span class="error">(type part or all of a first name)</span> </td>
<td width="46%"> </td>
</tr>
<tr>
<td height="28" align="left"> <input type="text" name="fname" id="fname" tabindex="2" maxlength="25" /></td>
<td align="center">
<input type="submit" name="Find" id="Find" value=" Find " tabindex="4" /></td>
</tr>
<tr>
<td height="28" > </td>
<td> </td>
</tr>
<tr>
<td height="27" colspan="2">
<table width="100%" border="0" cellspacing="0" cellpadding="0" class="innertableborder loginfont">
<tr>
<td width="6%" height="28"> </td>
<td width="18%"><strong>Full Name</strong></td>
<td width="24%"><strong> Workforce ID </strong></td>
<td width="18%"><strong>Service</strong></td>
<td width="34%"><strong>Role </strong></td>
</tr>
</table>
</td>
</tr>
<tr>
<td height="116" colspan="2">
<div class="searchlist">
<table width="100%" border="0" cellspacing="0" cellpadding="0" bgcolor="#FFFFFF">
<tr>
<td width="6%" align="center"><input type="radio" name="radio" id="radio" value="radio" /></td>
<td width="18%"> </td>
<td width="24%"> </td>
<td width="18%"> </td>
<td width="34%"> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr> <tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr> <tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
</table>
</div>
</td>
</tr>
</table>
</td>
<td width="5"> </td>
<td width="649" height="369" >
<table width="100%" border="0" cellpadding="0" cellspacing="0" class="innertableborder tableborder">
<tr>
<td height="28" colspan="4" class="tableheading"><p><strong>Workforce Employment Information Form</strong></p></td>
</tr>
<tr>
<td height="28" width="18%" nowrap="nowrap" class="loginfont">
<span class="error">* </span><strong>Last Name</strong> </td>
<td width="30%">
<input type="text" name="lname2" id="lname2" tabindex="5" maxlength="25"/> </td>
<td width="17%" nowrap="nowrap" class="loginfont"><span class="error">* </span><strong>WorkforceID</strong>
</td>
<td width="35%"><input type="text" name="wkid2" id="wkid2" tabindex="13" maxlength="10"/>
</td>
</tr>
<tr>
<td height="28" nowrap="nowrap" class="loginfont">
<span class="error">*</span><strong> First Name</strong> </td>
<td><input type="text" name="fname2" id="fname2" tabindex="6" maxlength="25"/>
</td>
<td nowrap="nowrap" class="loginfont"><span class="error">* </span><strong>Service</strong> </td>
<td><select name="tenure2" tabindex="14" >
<option> XXXX </option>
</select> </td>
</tr>
<tr>
<td height="28" nowrap="nowrap" class="loginfont">
Middle Initial </td>
<td>
<input type="mname" name="mname" id="wkfid" maxlength="1" size="5" tabindex="7"/>
</td>
<td class="loginfont"><strong> Role </strong></td>
<td><input type="text" name="role" id="role" tabindex="15" maxlength="10"/></td>
</tr>
<tr>
<td height="32" nowrap="nowrap" class="loginfont"> <span class="error">* </span><strong>Tenure</strong> </td>
<td>
<select name="tenure" tabindex="8" >
<option>
XXXX </option>
</select>
</td>
<td class="loginfont"><strong> Approver?</strong></td>
<td><input type="mname" name="approver" id="approver" maxlength="1" size="5" tabindex="16"/></td>
</tr>
<tr>
<td height="28"><span class="loginfont"> <span class="error">* </span><strong>Department</strong></span> </td>
<td><select name="dept" tabindex="9" >
<option> DL-00000001 </option>
</select> </td>
<td class="loginfont"><strong> Trainer? </strong> </td>
<td><input type="mname" name="trainer" id="trainer" tabindex="17" maxlength="1" size="5"/> </td>
</tr>
<tr>
<td height="28"><span class="loginfont"> <span class="error">*</span><strong> Job Title</strong></span> </td>
<td><input type="text" name="jtitle" id="jtitle" tabindex="10" maxlength="70"/> </td>
<td class="loginfont"><strong> Comments </strong> </td>
<td> </td>
</tr>
<tr>
<td height="28"><span class="loginfont"> <span class="error">*</span><strong> Position Level</strong></span>
</td>
<td><input type="text" name="poslevel" id="poslevel" tabindex="11" maxlength="10"/>
</td>
<td colspan="2" rowspan="3">
<textarea name="commenttxtbox" id="commenttxtbox" cols="30" rows="5" tabindex="18" wrap="soft" ></textarea>
</td>
</tr>
<tr>
<td height="28"><span class="loginfont"> <span class="error">*</span><strong> Effective Date</strong></span>
</td>
<td><input type="text" name="effdate" id="effdate" tabindex="12" maxlength="11"/> </td>
</tr>
<tr>
<td> </td>
<td> </td>
</tr>
<tr>
<td height="19" colspan="4">
<div class="error" id="valerror3"> </div>
</td>
</tr>
<tr>
<td align="right" colspan="2" nowrap="nowrap">
<input type="submit" name="add" id="add" value=" ADD " tabindex="19" />
<input type="submit" name="edit" id="edit" value=" EDIT " tabindex="20" />
<input type="submit" name="delete" id="delete" value="DELETE" tabindex="21" /> </td>
<td colspan="2" nowrap="nowrap" align="center">
<input type="submit" name="save" id="save" value=" Save " tabindex="22" />
<input type="submit" name="cancel" id="cancel" value="Cancel" tabindex="23" /> </td>
</tr>
<tr>
<td height="23" colspan="4">
<div class="error" id="valerror3"> </div>
</td>
</tr>
</table>
</td>
<td width="4" > </td>
</tr>
<tr>
<td colspan="5">
<!-- Insert the HMTL table below and the heading above -->
<!-- <div class="accountsearchlist">
<table width="100%" border="0" cellspacing="0" cellpadding="0" bgcolor="#FFFFFF" class="tablefont" >
-->
<!-- </table>
</div>
-->
</td>
</tr>
<!-- <tr>
<td colspan="5" align="center"> </td>
</tr>-->
<tr>
<td colspan="5">
<table width="97%" border="0" cellspacing="0" cellpadding="0" align="center">
<tr>
<td class="tableheading" height="28"><p><strong>Workforce Member ID Search HISTORY</strong></p></td>
</tr>
<tr>
<td >
<div class="accountsearchlist">
<table width="100%" border="1px" cellspacing="0" cellpadding="2" class="tablefont">
<tr>
<td width="6%"> </td>
<td width="8%"><div align="center"><strong>Effective Date</strong></div></td>
<td width="8%"><div align="center"><strong>Last Name</strong></div></td>
<td width="8%"><div align="center"><strong>First Name</strong></div></td>
<td width="9%"><p align="center"><strong>Middle Initial</strong></p> </td>
<td width="5%"><div align="center"><strong>Service</strong></div></td>
<td width="5%"><div align="center"><strong>Tenure</strong></div></td>
<td width="11%"><div align="center"><strong>Department</strong></div></td>
<td width="8%"><div align="center"><strong>Job Title</strong></div></td>
<td width="10%"><div align="center"><strong>Position Level</strong></div></td>
<td width="22%"><div align="center"><strong>Comments</strong></div></td>
</tr>
<tr>
<td align="center"><input type="radio" name="radio" id="r1" value="r1" /></td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td align="center"><input type="radio" name="radio" id="r1" value="r1" /></td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td align="center"><input type="radio" name="radio" id="r1" value="r1" /></td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td align="center"><input type="radio" name="radio" id="r1" value="r1" /></td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td align="center"><input type="radio" name="radio" id="r1" value="r1" /></td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td align="center"><input type="radio" name="radio" id="r1" value="r1" /></td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
</table>
</div>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td colspan="5">
<table width="100%" border="0" cellpadding="0" cellspacing="0">
<tr>
<td width="9%" height="85"> </td>
<td width="15%" nowrap="nowrap">
<fieldset>
<legend class="loginfont">Navigation</legend>
<br />
<input type="submit" name="mainmenu" id="mainmenu" value="Main Menu" tabindex="24" />
<input type="submit" name="logout" id="logout" value="Log out" tabindex="25" />
<br />
</fieldset>
</td>
<td width="76%"> </td>
</tr>
</table>
</td>
</tr>
</table>
</form>
</body>
</html>
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
ASKER
No, just select radio button and not find button. We have to query DB .
call onchange function when user click radio button.
<input type="radio" name="radio" id="radio" value="radio" onChange="ex()" />
function ex()
{
document.forms[0].action="/SomeServlet?operation=getFullNameFromDB"
document.forms[0].submit();
}
SERVLET
*********
if(request.getParameter("operation").equals("getFullNameFromDB"))
{
DataSource ds= (DataSource) context.lookUp("java:oraclePool");
Connection con = ds.getConnection();
PreparedStatement stmt =con.preparedStatement();
ResultSet rs= stmt.createQuery("select * from table where table='fullname'";
ArrayList al = new ArrayList();
while(rs.next())
{
Customer c =new Customer();
c.setEffectiveDate(rs.getDate(1))
c.setLastname(rs.getString(2))
c.setFirstName(rs.getString(3));
...
al.add(c);
}
request.setAttribute("results",al);
}
in jsp print these values in History grid.
ArrayList results = (ArrayList)request.getAttribute("results");
for(int i=0;i<results.size();i++)
{
(Customer) c =(Customer)results.get(i);
print these values in the history grid jsp
}
ASKER
Thanks this is working but, there is problem it works fine when I click on twice on radio button but not first time. i.e. suppose I have three radio button. When I select first one nothing happens then when I select second one at that time first one gets called. same it with other buttons like when I click 3rd then nothing happens and when I click first then 3rd is called. Here whats I did
<script type="text/javascript">
var formInUse = false;
function setFocus()
{
if(!formInUse) {
document.add.lname.focus() ;
}
}
function triggerval()
{
document.forms[0].action=" /jsp/S1Con troller.js p?operatio n=getval";
document.forms[0].submit() ;
}
</script></head>
In in JSP FORM
<tr>
<td width="6%" align="center"><input type="radio" name="wfradio" id="radio" value="<%= strValue %>"
onChange="triggerval()" /></td>
<td width="18%"><%= strScreenName[0] %></td>
<td width="24%"><%= strScreenName[1] %></td>
<td width="18%"><%= strScreenName[2] %></td>
<td width="34%"><%= strScreenName[3] %></td>
</tr>
<script type="text/javascript">
var formInUse = false;
function setFocus()
{
if(!formInUse) {
document.add.lname.focus()
}
}
function triggerval()
{
document.forms[0].action="
document.forms[0].submit()
}
</script></head>
In in JSP FORM
<tr>
<td width="6%" align="center"><input type="radio" name="wfradio" id="radio" value="<%= strValue %>"
onChange="triggerval()" /></td>
<td width="18%"><%= strScreenName[0] %></td>
<td width="24%"><%= strScreenName[1] %></td>
<td width="18%"><%= strScreenName[2] %></td>
<td width="34%"><%= strScreenName[3] %></td>
</tr>
SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
ASKER