HTML form that causes a GET request - html

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>

Related

Sending additional parameters via form using POST: hidden fields or query parameters

I have some HTML forms and I need to provide additional parameters which the user will not fill up in the form UI. I understand I can do it using query parameters or hidden form fields. Examples :
a form whose data must be submitted to the server together with an option chosen in the previous web page
Ex: URL /createImage?option=option_value (accessible via GET by user) would contain the HTML code below
Query parameter
<form action='/createImage?option=option_value'>
<input type='textfield1' name='var1'>
</form>
Hidden field
<form action='/createImage'>
<input type='hidden' name='option' value='option_value'>
<input type='textfield1' name='var1'>
</form>
(in this case, I suppose a third solution would be to use a HTTP session variable instead)
a fake form used to associate a POST HTTP request with a image.
Query parameter
<form action='/createContainer?image=image1'>
<input type='image' src='container.png'>
</form>
Hidden field
<form action='/createContainer'>
<input type='hidden' name='image' value='image1'>
<input type='image' src='container.png'>
</form>
(in this case, I suppose a third solution would be to use a standard img HTML tag and use Javascript to send the POST request to the server on its click() event)
Are there any upsides/downsides in each one of those approaches or is it just a matter of personal preference?

What is the difference between method="post" and type="submit" (HTML)?

Are they completely different things? I don't really get forms yet and many of the guides I found online don't really use type="submit" so I thought I would ask.
method is a form attribute. It specifies the method for requesting the server. It has only two options, either GET or POST. Use GET if your form has not sensitive data, while use POST when you are trying to submit sensitive data like user login. You can refer for more information here: https://www.w3schools.com/tags/att_form_method.asp#:~:text=The%20method%20attribute%20specifies%20how,URL%20in%20name%2Fvalue%20pairs
type is the attribute for input which specifies what the input is gonna be. It's options are text, email, password, checkbox, submit and many more. The type submit tells the input to submit the form when the user clicks the input which has this type on it. Have a look at it https://www.w3schools.com/tags/att_input_type.asp.
Example:
<form action="to/the/action" method="POST">
<input type="text" placeholder="Enter user name" />
<input type="submit" value="submit your form" />
</form>
Here is the simple form which tells the browser to show an input of text telling the user to enter user name. The action is the path where you want to send the form data, while type=submit is defining that submit this form when user clicks me.

How to hide parameters in URL without javascript?

My form is like this:
<form method="GET" action="target">
<input type="text" name="filter"/>
<select name="skill">
<option>opt1</option>
<option>opt2</option>
<option>opt3</option>
</select>
<input type="number" name="level"/>
<input type="submit"/>
</form>
I would like the empty parameters not to be shown in the URL when the form is submitted, and this happens with the skill field , but not with level and filter, which are added to the Query string even though they're empty. How does it happen? Is it possible to prevent this from happening without using javascript?
None of these fields is required to submit the form.
This is not possible without javascript.
You can use something like jQuery to accomplish this.
note: Using form method POST is the preferred way of submitting forms, and the parameters are submitted as http request body and not in the URL.
If you do a form POST instead of GET, the form params will not appears in the query string. But that would require back end changes.

How to design form tags button in html

I have a button that is this <button id="btnSubmit">Submit</button> the problem is, I want the form tags to use this id so that is designed the way I want. And also this code, I have a few questions.
<form action="demo_form.php" method="get">
First name: <input type="text" name="fname"><br>
Last name: <input type="text" name="lname"><br>
<input type="submit" value="Submit">
</form>
what is the action="demo_form.php",input type="submit" do? And does the input type has any other "What do you call this stuff" besides submit?
The action="demo_form.php" sets the action, in this case, "navigate to file demo_form.php and send it the data".
<input type="submit" (...) > creates and element which submits the form e.g. executes the "action".
The method sets the way the data is submitted to the target of the action ("form_demo.php"), in this case get, which allows you to refer to the submitted data as $GET["name"] in PHP.
Possible input types are listed here.
You either give your <input type="submit" (...) > the id="btnSubmit" property or use javascript to submit the form after an event has been triggered.
MOr info on that is available here (i short: document.<get_the_form_element>.submit();).
I suggest you to take a look at this link. It describes all the basic concepts about how using forms. And you can also find a lot of information by Googling it.
The action attribute
The action attribute defines the action to be performed when the form is submitted.
The common way to submit a form to a server, is by using a submit button.
The input attribute
<input type="submit"> defines a button for submitting a form to a form-handler.
The form-handler is typically a server page with a script for processing input data.
If i understand your question correctly, these are my answers.
action
The action attribute describes the page to which the contents of the form are sent to. So if you have a sign up form with an input for an email, the text that is typed will be sent to the action path. It will be sent using the method described in the method attribute. So you can find your values in either the $_POST variable, or the $_GET variable, get is easy for being able to share the url and post is great for private information.
input
The input element is the actual way to input information (who guessed it). You've got an input of the type text for just text input, you've got checkbox for a true or false input and way way more see: w3schools
why don't you use
<input type="submit" value="Submit" id="btnSubmit">
Or if you want to use a button
<button id="btnSubmit">Submit</button>
Then from jquery or js you can submit the form.
And for this question,
what is the action="demo_form.php",input type="submit" do?
You should probably google it out. This is so basic.
Anyway, just a concise explanation:
action is the attribute where you will specify the code that will handle the form data submitted and input type="submit" will display a button in the page, clicking on it will submit the form.
There are a lot of types in input, the most common ones are
text
password
submit

Stop the 'submit' button value from being passed via GET?

I'm trying to pass form information via GET - this is important so that people can send the filtered data from their form selections to other people.
The problem is, using the code below, it not only passes the filter information, but also the submit form value like so: index.php?month_filter=Feb&year_filter=12&Submit=Filter+Table
<form name="filter_form" action="<?php echo CURRENT_PAGE ?>" method="get">
<input name="Submit" type="submit" class="button" value="Filter Table">
Long shot, but is there a way to remove the submit button from the URL? Thanks!
If you remove the name attribute, it will not get passed through in GET/POST.