简体   繁体   中英

How to create a button to respective table which is a response from a server and on button click send the contents as post request to the same server?

I have a javascript code which sends a GET request to the server and receives the XML response and puts the contents into the table,I'm supposed to create buttons to each row and when its clicked it should post the row contents back to the server,how could I do this?

 function loadDoc() { var xhttp = new XMLHttpRequest(); xhttp.onreadystatechange = function() { if (this.readyState == 4 && this.status == 200) { myFunction(this); } }; xhttp.open("GET", "http://10.114.56.217:8080/Online_shopping_cart/services/smartphonelist", true); xhttp.send(); } function myFunction(xml) { var i; var xmlDoc = xml.responseXML; var table="<tr><th>TYPE</th><th>MAKE</th><th>PRICE</th><th>MODEL</th><th>ID</th><th>Select</th></tr>"; var x = xmlDoc.getElementsByTagName("itemnumber"); for (i = 0; i <x.length; i++) { table += "<tr><td>" + x[i].getElementsByTagName("type")[0].childNodes[0].nodeValue + "</td><td>" + x[i].getElementsByTagName("make")[0].childNodes[0].nodeValue + "</td><td>"+ x[i].getElementsByTagName("price")[0].childNodes[0].nodeValue + "</td><td>" + x[i].getElementsByTagName("model")[0].childNodes[0].nodeValue + "</td><td>"+ x[i].getElementsByTagName("id")[0].childNodes[0].nodeValue + "</td></tr>"; } document.getElementById("dem").innerHTML = table; } 
 <html> <button type="button" onclick="loadDoc()">Smartphones</button> <table id="dem"></table> </html> 
My response snapshot is shown in the below link

https://i.stack.imgur.com/iyzCL.png

I am not much experienced with javascript, as of your question need to add button in each row with different identifier, so on brief there are various way of doing it and one of the way is below,

  1. When you insert contents in table u can there itself create a button for each row same like html but you can add suffix of incremental number to button name. (like : name0, name1) as directly concatenate i with button name.

  2. on click on every function call same function with that button name, and in function extract suffix number from button name.

  3. now with that number you can find the what need to be send in next request.

This not might be perfect solution but yes it will help you.

Thank You

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM