Databases
StackOverflow2013
Postsdbo
POGet ajax response in dynamic generated row?
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POGet ajax response in dynamic generated row?
    text
    copied!<p>here i create a dynamic web project in which, I using three text fields in a row. when i fill testcode in first text field and press tab key then testname and rate both values are come in other two text field from database using ajax response. And when i click on third text field a new dynamic row is generated in which three text fields also present but the problem is that when i fill value testcode in first field of dynamic generated row and press tab key then testname and rate both values are placed in first row text fields, instead of second row which is dynamic generated. the program is working in first row but it is not working in dynamic generated row.</p> <p>please provide solution:</p> <p>You can see the output in the images below:</p> <p>the code is :</p> <p>index.jsp:</p> <pre><code>&lt;table id="testtable" width="350px" border=""&gt; &lt;tr&gt; &lt;td colspan="" align="center" bgcolor="silver" &gt;&lt;font face="Times New Roman" size=3&gt;&lt;b&gt;Test ID&lt;/b&gt;&lt;/font&gt;&lt;/td&gt; &lt;td align="center" bgcolor="silver" &gt;&lt;font face="Times New Roman" size=3&gt;&lt;b&gt;Test Name&lt;/b&gt;&lt;/font&gt;&lt;/td&gt; &lt;td align="center" bgcolor="silver" &gt;&lt;font face="Times New Roman" size=3&gt;&lt;b&gt;Rate&lt;/b&gt;&lt;/font&gt;&lt;/td&gt; &lt;/tr&gt; &lt;tr&gt;&lt;td colspan="3"&gt; &lt;TABLE id="dataTable" width="350px" border=""&gt; &lt;TR&gt; &lt;TD&gt;&lt;INPUT type="checkbox" name="chk"/&gt;&lt;/TD&gt; &lt;td&gt;&lt;INPUT type="text" id="tc" name="testcode" style="width:86px;border:1px solid gray" onblur="mango1(this.value)"/&gt;&lt;/TD&gt; &lt;TD&gt;&lt;INPUT type="text" id="testname" name="testname" style="width:165px;border:1px solid gray"/&gt;&lt;/TD&gt; &lt;TD&gt;&lt;INPUT type="text" id="rate" name="rate" style="width:65px;border:1px solid gray" onclick="addRow('dataTable')" /&gt;&lt;/TD&gt; &lt;/TR&gt; &lt;/TABLE&gt;&lt;/td&gt;&lt;/tr&gt; &lt;/table&gt; </code></pre> <h1>ajax.js</h1> <pre><code>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&lt;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&lt;rowCount; i++) { var row = table.rows[i]; var chkbox = row.cells[0].childNodes[0]; if(null != chkbox &amp;&amp; true == chkbox.checked) { if(rowCount &lt;= 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 &amp;&amp; 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(); } </code></pre> <h1>PatientAction.java (servlet)</h1> <pre><code>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&lt;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)); } } } } </code></pre> <h1>TestDAO.java</h1> <pre><code>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; } } </code></pre> <h1>output is</h1> <p><img src="https://i.stack.imgur.com/EzyMl.png" alt="enter image description here"></p> <p><img src="https://i.stack.imgur.com/5nmTN.png" alt="enter image description here"></p>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload