在这里,我创建了一个动态 Web 项目,在该项目中,我连续使用三个文本字段。当我在第一个文本字段中填写 testcode 并按 tab 键时,testname 和 rate 两个值都来自使用 ajax 响应的数据库中的其他两个文本字段。当我单击第三个文本字段时,会生成一个新的动态行,其中还存在三个文本字段,但问题是当我在动态生成行的第一个字段中填充值 testcode 并按 Tab 键时,会放置 testname 和 rate 这两个值在第一行文本字段中,而不是动态生成的第二行。该程序在第一行工作,但它不在动态生成的行中工作。
请提供解决方案:
您可以在下图中看到输出:
代码是:
index.jsp:
<table id="testtable" width="350px" border="">
<tr>
<td colspan="" align="center" bgcolor="silver" ><font face="Times New Roman" size=3><b>Test ID</b></font></td>
<td align="center" bgcolor="silver" ><font face="Times New Roman" size=3><b>Test Name</b></font></td>
<td align="center" bgcolor="silver" ><font face="Times New Roman" size=3><b>Rate</b></font></td>
</tr>
<tr><td colspan="3">
<TABLE id="dataTable" width="350px" border="">
<TR>
<TD><INPUT type="checkbox" name="chk"/></TD>
<td><INPUT type="text" id="tc" name="testcode" style="width:86px;border:1px solid gray" onblur="mango1(this.value)"/></TD>
<TD><INPUT type="text" id="testname" name="testname" style="width:165px;border:1px solid gray"/></TD>
<TD><INPUT type="text" id="rate" name="rate" style="width:65px;border:1px solid gray" onclick="addRow('dataTable')" /></TD>
</TR>
</TABLE></td></tr>
</table>
ajax.js
function addRow(tableID) {
try{
var table = document.getElementById(tableID);
// var rowCount = table.rows.length;
// var row = table.insertRow(rowCount);
var row = table.insertRow(-1);
var colCount = table.rows[0].cells.length;
for(var i=0; i<colCount; i++) {
var newcell = row.insertCell(i);
newcell.innerHTML = table.rows[0].cells[i].innerHTML;
}
}catch(e){
alert(e);
}
}
function deleteRow(tableID) {
try {
var table = document.getElementById(tableID);
var rowCount = table.rows.length;
for(var i=0; i<rowCount; i++) {
var row = table.rows[i];
var chkbox = row.cells[0].childNodes[0];
if(null != chkbox && true == chkbox.checked) {
if(rowCount <= 1) {
alert("Cannot delete all the rows.");
break;
}
table.deleteRow(i);
rowCount--;
i--;
}
}
}catch(e) {
alert(e);
}
}
function mango1(testcode)
{
alert("this is mango"+testcode);
var xmlhttp;
if(window.XMLHttpRequest)
{
xmlhttp=new XMLHttpRequest();
}
else
{
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if(xmlhttp.readyState==4 && xmlhttp.status==200)
{
var responseTextVar = xmlhttp.responseText;
var item=responseTextVar.split(',');
document.getElementById("testname").value=item[0];
document.getElementById("rate").value=item[1];
}
};
xmlhttp.open("POST","PatientAction?testcode="+testcode, true);
xmlhttp.send();
}
PatientAction.java (servlet)
package action;
import java.io.IOException;
import java.io.PrintWriter;
import java.util.Vector;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import dao.PatientDAO;
import dao.TestDAO;
import beans.Patient;
import beans.Address;
//import beans.Candidate;
/**
* Servlet implementation class PatientAction
*/
@WebServlet("/PatientAction")
public class PatientAction extends HttpServlet {
private static final long serialVersionUID = 1L;
/**
* @see HttpServlet#HttpServlet()
*/
public PatientAction() {
super();
// TODO Auto-generated constructor stub
}
/**
* @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse response)
*/
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
// TODO Auto-generated method stub
doPost(request,response);
}
/**
* @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse response)
*/
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
// TODO Auto-generated method stub
PrintWriter out=response.getWriter();
response.setContentType("text/html");
Vector vec=new Vector();
//1. String testcode=request.getParameter("testcode");
String testcode[]=request.getParameterValues("testcode");
TestDAO t1=new TestDAO();
//2. Vector vec=t1.getNameAndRate(testcode);
if(testcode!=null)
{
int length=testcode.length;
for (int i=0; i<length; i++) {
System.out.println("i am here in post3354333"+ testcode[i]+length);
vec=t1.getNameAndRate(testcode[i]);
out.write((String) vec.get(0)+",");
out.write((String) vec.get(1));
}
}
}
}
TestDAO.java
package dao;
import java.sql.Connection;
import java.sql.PreparedStatement;
import java.sql.ResultSet;
import java.util.Vector;
import dao.DBCon;
import beans.Admin;
import beans.Test;
public class TestDAO {
// method to get values from ajax
public Vector getNameAndRate(String testid)
{
Connection con=DBCon.getConnection();
System.out.println("got connection");
Vector temp=new Vector();
try
{
ResultSet rset=null;
PreparedStatement pst = con.prepareStatement("select testname,rate from test where testcode=?");
System.out.println("got controllll here in getNmaeANDRATE");
pst.setString(1,testid);
rset=pst.executeQuery();
while(rset.next()){
temp.add(rset.getString(1));
temp.add(rset.getString(2));
System.out.println("got control here in loop");
}
}
catch(Exception e)
{
e.printStackTrace();
}
return temp;
}
}