Keep on same page after submit POST through form - html

I've a little problem. I submit a form to my route/uploadpdf with
<form action="http://localhost:3000/user/uploadpdf" enctype="multipart/form-data" method="post" onSubmit=window.location.replace('http://localhost:3000/statictoken')>
<input type="file" name="upload" multiple>
<input type="submit" value="Upload">
</form>
and when it is complete the browser tries to traverse to uploadpdf.
What I actually want is to stay on the current page ("statictoken") and refresh. You can see I've attempted to replace onSubmit, but it doesn't work.

The form action attribute is used to send the request to the specified page. If you want to send the request to the current page itself, you should have the following :
<form action="/" ...>
But keep in mind that now, you have to tackle the functionality of uploadpdf page on your 'statictoken' page.
You can also redirect to the "statictoken" page from the "uploadpdf" page after the file upload completes.
Or better, you can use Ajax File Upload, so that form is submitted asynchronously without redirecting you to the "uploadpdf" page.

Related

HTML form that causes a GET request

Basic question. If I have a form in my HTML (where in my case someone inputs a date), how can I have my users cause a GET request with the contents of that form instead of a POST.
e.g. form entry (e.g date)... so 20190312
what I am trying to achieve is such that AFTER the user submits the form.. the user is the lead to page that has
GET domain.tld/scriptname.php?variable=20190312
and then the system then processes the GET request accordingly.
thank you
Maybe i'm missunderstanding what you are asking.
This can easly be achived using builtin GET method in FORM tag
<body>
<form id="form" method="GET" action="scriptname.php">
<input id="date-txt" type="text" name="date">
<input id="search-btn" type="submit" value="Submit">
</form>
</body>
While filling up above field ad clicking "Submit" form will be submitted and you can see in your url path/or/page/scriptname.php?date=INPUT_FIELD_VAL
for every input in #form with a name, if GET method is used, you'll see a ?name=value in the url
What you describe is the default behaviour of a form. If you don't want a POST request, then don't use a method attribute to set the request type to POST.
<form action="//domain.tld/scriptname.php">
<input name="variable" value="20190312">
<button>Submit</button>
</form>

form target=iframe is redirecting instead of loading

I have an html form that has no javascript whatsoever, and I am trying to use an iframe to load the response.
My html looks like
<form method="post" action="http://localhost:3000/post_transfer" target="something">
<input type="text" name="user"/><input type="text" name="quantity"/>
<input type="submit"/>
</form>
<iframe name="something" id="something"></iframe>
What I want to happen is that the form is submitted and the iframe is filled with the response and stays on the current page.
The iframe is filled as expected, but then redirects to the post_transfer page with a rails error. (The error does not occur if I remove target=iframe from the form, but I feel that is not relevant)
Here is a short clip: https://i.imgur.com/mhTClbL.mp4
Why is this happening and how can it be fixed?
Try sandbox html attribute on iframe to test if you can prevent redirection.
See https://w3schools.com/tags/att_iframe_sandbox.asp
If it works, it means that the targeted page ("http://localhost:3000/post_transfer") is sending redirection headers in the response.

possible to make a request without redirecting the page and without using javascript?

I just want to send a post request to an api. So far I have:
<form method="POST" action="/api/updoot/ID:{{ post.ID }}">
<input type="submit" value="updoot"/>
</form>
When I click submit it redirects. I know how to prevent the redirection with javascript but I was wondering if it's possible to send the request without using javascript and without redirecting the user?
Yes, it's possible to make an HTTP request, without page re-direction, and without any JavaScript.
The trick is: make an invisible iframe, and use it as the target of form. In this way, when form is submitted, the HTTP request is sent, and the response will be processed in iframe. As the iframe is invisible, nothing would change in page.
Here is an example:
#subframe {
display: none;
}
<form method="POST" action="https://requestb.in/xkaff3xk" target="sub">
<input type="text" name="test">
<input type="submit" value="updoot"/>
</form>
<iframe id="subframe" name="sub">
</iframe>

Submitting form in HTML - redirecting

I have a form in my webpage,
The form uploads a file to my server.
currently when the file upload form submits, after the server side finishes saving the image it tries to redirect my webpage to a different page :( (the name of the form action)
is there a way to execute the form without the redirect part? like an ajax call for uploading my image?
thanks.
here is the form:
<form method="POST" action="/project/upload"
enctype="multipart/form-data">
Please select a file to upload : <input type="file" name="file" />
<input type="submit" value="upload" />
</form>
EDIT - Let me try to rephrase it:
is it possible to submita form in such a way that it wont change my page or redirect?
and is it possible to create a call back when it finishes?
You can use target="iframeName" on your form to get it to post to an iframe on the page with no reloads occuring. Something a little like this:
<form method="POST" action="/project/upload"
enctype="multipart/form-data" target="myFrame">
..Form content..
</form>
<iframe name="myFrame" height=0 width=0></iframe>
Think best way is using a php page which calls itself with no redirect:
<form action="<?php echo $_SERVER['PHP_SELF'];?>" method="post">
....
</form>
So you call the same page to do upload and don't need redirect. In other way you can add header in php page "/project/upload" with automatic redirect to put after upload code:
header("location: yourpage.html");

Can I stop the form action from redirecting the user to another page?

I have this form:
<form name="input" action="http://s164074194.onlinehome.us/mail.py" method="POST">
Username:
<input type="text" name="email" />
<input type="submit" value="Submit" />
</form>
On submission, the mail.py script is called and the user is redirected to its output...
I'd like the user to just stay on the same page as the form, right now when I click submit on the form I'm redirected to mail.py, which is on another site. Is it possible to disable this redirect action and instead just invoke the script?
Thanks
As #josh mentioned, you probably want to submit the form via AJAX, but if the script is on another site, then I don't think you will be able to do that.
Probably your best bet is to have a hidden iframe with the real form that gets submitted, and when the user clicks the button on the visible form, some javascript copies the field values to the hidden form, and submits it.
You might also be able to just specify a target on the form to be the hidden iframe, and not worry about the javascript part, but I haven't tried it.
Submit it via AJAX.
One solution would be to have mail.py redirect the browser to a different page once it has finished running whatever functions with the form data.
I'm not sure of the situation you have but if you don't have access to edit mail.py then perhaps you can get a local copy of it if possible.
If Possible then write a name same name in "action='current_filename'"
<form name="input" action="current_file_name" method="POST">
Username:
<input type="text" name="email" />
<input type="submit" value="Submit" />
</form>