Reload before response and uncheck radio button

Question

I am getting response without a refresh! When the user clicks on the button, I want it to reload and then display the response!How can I do that? And What should I do to uncheck the radio box after the response?

<script>
function sendid(attack) {
  var att;
  var xmlhttp;
  if (window.XMLHttpRequest) {// code for IE7+, Firefox, Chrome, Opera, Safari
    xmlhttp = new XMLHttpRequest();
  } else {// code for IE6, IE5
    xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
  }
  xmlhttp.onreadystatechange = function() {
    if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
      document.getElementById("result").innerHTML = xmlhttp.responseText;
    }
  }
  xmlhttp.open("POST", "battleuser2.php", true);
  xmlhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
  xmlhttp.send("att=" + attack);

}
</script>

This is my radio form:

<input type="radio" value="10" id="radioButtonId" onClick="sendid(this.value)"/> Attack 1
<input type="radio" value="20" id="radioButtonId" onClick="sendid(this.value)"/> Attack 2

Answer 1

No, you can't reload and display the response unless you are making the ajax call on page load again.

else you need to store the previous response in localstorage and access it from it when the page reloads again.

Regarding unchecking the radio button after the response, Insert the following code inside the if condition:

document.getElementById("radioButtonId").checked = false;

example:

if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
      document.getElementById("result").innerHTML = xmlhttp.responseText;
      document.getElementById("radioButtonId").checked = false;   
    }