javascript - Learning AJAX, html code won't do anything -
i have set servlet displaying usernames,passwords,wins,and losses checkersgame wrote. want create ajax program access page , create table listing users wins , losses (like simple leader board). html code won't work , can't see why. can log page list variable url , see xml file servlet. appreciated.
<html> <head> <script type="text/javascript"> function requestupdate() { var req = newxmlhttprequest(); req.onreadystatechange = function() { if(req.readystate == 4) { displayresult(req); } } var url = "http://localhost:8080/checkers/checkersservlet"; req.open("get",url,true); req.send(null); } function displayresult(req) { var div = document.getelementbyid("scoreboard"); div.innerhtml = "<table border> <tr> <th> username </th> <th> wins </th> <th> losses </th> </tr>" ; var doc = req.responsexml; var users = doc.getelementsbytagname('username'); var wins = doc.getelementsbytagname('wins'); var losses = doc.getelementsbytagname('losses'); var u; var w; var l; for(var = 0; < users.length; i++) { u = users.item(i).textcontent; w = wins.item(i).textcontent; l = losses.item(i).textcontent; div.innerhtml = div.innerhtml + "<tr> <td>" + u + "</td> <td>" + w + "</td> <td>" + l + "</td> </tr>"; } div.innerhtml = div.innerhtml + "</table>"; } </script> </head> <body onload = "requestupdate()"> <button onclick = "requestupdate()">update</button> <div id = "scoreboard"></div> </body> here servlet code
import java.io.ioexception; import java.io.filereader; import java.io.bufferedreader; import java.io.printwriter; import javax.servlet.servletexception; import javax.servlet.annotation.webservlet; import javax.servlet.http.httpservlet; import javax.servlet.http.httpservletrequest; import javax.servlet.http.httpservletresponse; /** * servlet implementation class checkersservlet */ @webservlet("/checkersservlet") public class checkersservlet extends httpservlet { private static final long serialversionuid = 1l; /** * @see httpservlet#httpservlet() */ public checkersservlet() { 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 response.setcontenttype("text/xml"); printwriter out = response.getwriter(); out.println("<?xml version='1.0'?>" ); bufferedreader freader = new bufferedreader(new filereader("/users/adamsturge991/desktop/checkersdatabase.txt")); string data = freader.readline(); out.println("<checkersdata>"); while(data != null) { out.println("<user>"); out.println("<username>"); out.println(data); out.println("</username>"); data = freader.readline(); out.println("<password>"); out.println(data); out.println("</password>"); data = freader.readline(); out.println("<wins>"); out.println(data); out.println("</wins>"); data = freader.readline(); out.println("<losses>"); out.println(data); out.println("</losses>"); out.println("</user>"); data = freader.readline(); //get next username or null if end of database } out.println("</checkersdata>"); } /** * @see httpservlet#dopost(httpservletrequest request, httpservletresponse response) */ protected void dopost(httpservletrequest request, httpservletresponse response) throws servletexception, ioexception { // todo auto-generated method stub } }
this line:
var req = newxmlhttprequest(); needs space after new, so:
var req = new xmlhttprequest(); (note continually updating div.innerhtml in displayresult() function not give performance. better build required html in string variable , set div.innerhtml equal variable @ end.)
Comments
Post a Comment