Is this considered a POST or GET request? [duplicate] - javascript

This question already has answers here:
What is the default form HTTP method?
(5 answers)
Closed 4 years ago.
I saw the below code in w3school. I was wondering is this considered a POST request or a GET request. I only changed the action location to go to a java servlet rather than php.
<!DOCTYPE html>
<html>
<body>
<form id="myForm" action="/action">
First name: <input type="text" name="fname"><br> Last name: <input type="text" name="lname"><br><br>
<input type="button" onclick="myFunction()" value="Submit form">
</form>
<script>
function myFunction() {
document.getElementById("myForm").submit();
}
</script>
</body>
</html>

<form>'s default method is GET.
So it is considered as a GET request. You'll see all the parameters are being binded to the URL once the form is submitted.
EDIT (answering this comment):
Easiest way to change the method of the form is to mention it in method attribute in the <form> tag.
<form method='POST' id="myForm">
Or you can use javascript as below,
document.getElementById("myForm").method = "POST";

Related

How to fix "member not found"- error in Javascript [duplicate]

This question already has answers here:
Microsoft JScript runtime error: Member not found
(2 answers)
"Submit is not a function" error in JavaScript
(19 answers)
Closed 3 years ago.
//html code for form
<form id="contactform" method="post" action="/action_page.php">
//submit button html code
<input type="button" id="submit" onclick="submit_form()" value="Submit">
//javascript submit function.
function submit_form()
{
document.getElementById("contactform").submit();
return false;
}
so here are the html and javascript snippets of my contact form, now when I am debugging my javascript code it is giving me a member not found error at the document.getElementById("contactform").submit(); line. The problem still persists even though the id of my button and the name of the function that runs are different. Can somebody please help me resolve this?
The problem was your input button had an ID of submit.
I renamed that id and you can see below a working code:
function submit_form()
{
document.getElementById("contactform").submit()
return false;
}
<form id="contactform" method="post" action="/action_page.php">
<input type="button" id="hsubmit" onclick="submit_form()" value="Submit">
</form>

Can the ?# added in the URL by an input be avoided? [duplicate]

This question already has answers here:
Stop form refreshing page on submit
(20 answers)
Closed 4 years ago.
I did this JS component but in some pages as codepen it crashes when I click submit because the the button adds a "?#" to the URL (running locally) and is like it changes to another page, this happens the first time I post a message, can be avoided? or is a normal thing of submit?
<div id = "typeSection">
<label for="message">Message:</label>
<form action="#" id="typeForm">
<label for="message"></label>
<textarea id= "character">0/280.</p>
<input type="submit" id = "addButton" value="Submit">
This is the component running in CodePen:
https://codepen.io/LeonAGA/pen/vroRBB
when you add 'action="#"' in the form tag below:
<form action="#" id="typeForm">
it redirects the page to the current url with a "#" appended on to the end. If you put:
<form action="" id="typeForm">
you shouldn't have to worry about the "#" anymore.
<form action="#" id="typeForm">
Action value might be the reason why adding # after the URL, try assign "" instead of # symbol

Disabling double submit prevent sending submit name [duplicate]

This question already has answers here:
behavior of javascript getElementById() when there are elements with duplicate IDs in HTML DOM?
(5 answers)
Closed 6 years ago.
I run into the bug with my multi form page:
I have two forms:
<form>
<input type="submit" id="single-submit" name="form_1" value="Submit 1"/>
</form>
<form>
<input type="submit" id="single-submit" name="form_2" value="Submit 2"/>
</form>
And this JavaScript to prevent double submit:
$("form").one('submit', function() {
$('#single-submit').prop("disabled", true);
});
I'm trying to get the submit name in php:
if(isset($_POST['form_1']))
{
// form 1 submitted
}
if(isset($_POST['form_2']))
{
// form 2 submitted
}
But JS is preventing this, why?
I can recieve submit name="" from second, third... form. But not from the first form on page.
UPDATE:
Removed double ids, added classes instead:
<form action="example.com/process" method="post" accept-charset="utf-8">
<input type="submit" class="single-submit" name="form_1" value="Submit 1"/>
</form>
<form action="example.com/process" method="post" accept-charset="utf-8">
<input type="submit" class="single-submit" name="form_2" value="Submit 2"/>
</form>
And this JavaScript to prevent double submit:
$("form").one('submit', function() {
$('.single-submit').prop("disabled", true);
});
Moreover now first AND second form does not return submit name.
Also tried on( instead, no luck.
So it seems something still wrong with JS.
Without this JS everything is working as expected.
Use a class instead of an id on this : id="single-submit".
An id must be unique.

Submit a form without clicking a button [duplicate]

This question already has answers here:
How can I submit a form using JavaScript?
(10 answers)
Closed 8 years ago.
<form class="myform" action="mail.php">
Your name:<br>
<input type="text" name="myform-name"><br><br>
Your file:<br>
<input type="file" name="myform-file"><br><br>
<button type="submit">Submit</button>
</form>
How do I submit this form using vanilla javascript (not jQuery) directly from the code (without user interaction)?
You can use:
document.getElementsByTagName('form')[0].submit()
Just add a form name in your code:
<form name="myform" class="myform" action="mail.php">
Your name:<br>
<input type="text" name="myform-name"><br>
<button type="submit">Submit</button>
</form>
submit the from from javascript:
<script type="text/javascript">document.myform.submit();</script>
Use this code
document.getElementById("my_form_id").submit();
Docs here

how to open same page onsubmit? [duplicate]

This question already has answers here:
POST form and prevent response
(2 answers)
Closed 9 years ago.
I have html form whose action is a php script. php code basically replaces the file.
HTML code:
<form name="input" action="//copy.php" method="POST" onsubmit="return alertbox();">
<input type="hidden" name="path1" value=path to image 1/>
<input type="hidden" name="path2" value='path to image 2' />
<input type="submit" name="submit" value="Copy image"/>
</form>
Php code:
if isset($_POST['submit']))
{
$image1 = $_POST['path1'];
$image2 = $_POST['path2'];
copy($image1, $image2);
}
?>
Now when I click submit, a alert box opens that "file is updated successfully" and when I click ok on it, a blank page load. How can I avoid loading the blank page? I want to stay on the same page after clicking submit with pop up msg.
SOLUTION
As I don't see "Answer your own question" option, I am posting solution here.
This link POST form and prevent response, gives you textual answer to the question. While I providing the answer by code.
So basically, it very simpl. Just put
header("HTTP/1.0 204 No Response");
in the php file and it will work successfully on all browser, without opening new page. This will avoid use of jquery.
Leave action empty.
<form method="post" action="">
Then check if posted using isset function
if(isset($_POST)){
...
}
This will keep you on the same page after submit button..
<form name="input" action="" method="POST" onsubmit="return alertbox();">
<input type="hidden" name="path1" value=path to image 1/>
<input type="hidden" name="path2" value='path to image 2' />
<input type="submit" name="submit" value="Copy image"/>
</form>
But now, your image(s) may not be loaded. Maybe it will work, maybe not. If not, you will need to resolve functions which may reside in copy.php file. Since we dont know whats in that file, its hard to answer your question correctly, but.. you may try this "blind" shot..
if(isset($_POST['submit']))
{
//include "//copy.php"; // this file probably contains functions, so lets load functions first IF needed..
$image1 = $_POST['path1'];
$image2 = $_POST['path2'];
copy($image1, $image2);
}
Have you tried changing the type on the input:
<input type="submit" name="submit" value="Copy image"/>
to
<input type="button" name="submit" id="submit" value="Copy image"/>
<input type="button" /> won't submit a form by default (check all browsers to be sure).
<input type="submit"> by default, the tag in which the submit input is, is submitted. If you still want to use this, you will have to override the input submit/button's functionality with an event.preventDefault(). In that case, you need:
$('#submit').click(function (event) {
event.preventDefault();
//Do whatever you need to
//Submit if needed: document.forms[0].submit();
});
For further details refer this link
action="<?php echo $_SERVER['PHP_SELF']; ?>

Categories