I am facing some problem with POST method in form . I have a page A with a form with POST method and when i submit form it goes to page b .
Now problem is that when i do a refresh it
pop ups a alert which i don't want to come . I am using HTML and Javascript.
Is there any way to handle this refresh?
One way that i can think of is to dynamically create a hidden form on page b with the values populated in fields and for every refresh it just submits that hidden form .
Please suggest and let me know if there is some other neat work around. Thanks in advance!
Basically i am using CGIDEV2 on AS400 platform . So when input form on page a is submitted it call abc.pgm which writes page b. Cgidev2 writes html in sections . It will write /TOP section then /REFRESHFORM. and these values will be populated in abc.pgm .
PAGE a
/FORM
<form name="input" action="abc.pgm" method="POST">
Username: <input type="text" name="user"><input type="submit" value="Submit"></form>
Page b
/TOP
-----------------
--------------
/REFRESHFORM
<form name="refreshinput" action="abc.pgm" method="POST">
Username: <input type="text" name="user"><input type="submit" value="Submit"></form>
You're trying to avoid the "confirm form resubmission" alert? The usual way to do that is using the POST/Redirect/GET pattern: page A would POST the form to the server, the server processes the data and then issues a 3xx redirect back to the user, triggering a GET request for page B. Thus subsequent reloads of page B would just be the usual drill, i.e. no alert message.
If you use a click event handler for a submit button, you just need to prevent default action on click.
$('#Submit').click(function(e){
e.preventDefault();
// submit the form using ajax
// on success go to the page B
...
}
There is no simple way to avoid this issue, but you can try to use an XMLHttpRequest object instead of forms. You will need to write some javascript code, but your server code will stay without changes.
See the following documentation and example.
<!DOCTYPE html>
<html>
<head>
<script>
function Submit()
{
var form = document.getElementById("data-form");
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)
{
form.innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open("POST","abc.pgm",true);
xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
xmlhttp.send("userName=" + form["userName"].value + "&userPass=" + form["userPass"].value);
}
</script>
</head>
<body>
<form id="data-form">
Username: <input type="text" name="userName">
Userpass: <input type="text" name="userPass">
<input id="submit" onclick="Submit()" type="button" value="Submit">
</form>
</body>
</html>
