Develop Reference

HTML form - POST or GET depending on button clicked

Let there be a search form with quite many of the input fields. The user may either click:
[Search] and GET the list of the results,
[Save search criteria] for future use and POST the form content to be stored on server (I'm not interested in storing locally in cookies or so).
How do I achieve that? I've only found solutions to make two types of POST request on two separate buttons.
Maybe a JavaScript onclick function to set <form method="??"> right before its submitted? Would that work?

In HTML5, the <input> element got some new attributes
<input type="submit" formmethod="post" formaction="save.php" value="Save" />
<input type="submit" formmethod="get" formaction="search.php" value="Search" />
The same attributes are valid for <button>

Yes you can change form method before submit form using jquery
<form method="POST" id="myForm">
<button onclick="changeMethod()">submit</button>
</form>
Function changeMethod in jquery
function changeMethod(){
$("#myForm").attr("method", "get");
}

Send text field value using href to php

I have to send text field value using href to php is something like below. But it is not correct way. Can anyone please give me any solution?
<input type="text" id="myText" value="Mickey">
<a href="test.php?id=javascript:document.getElementById('myText').value;">
<input type="button" value="Click"></a>

Put content inside a form. You can also change the button type input to a submit type, this way the form is sent automatically on click.
<form method="POST" action="yourURL.php">
<input type="text" id="myText" name="myElement" value="Mickey">
<a href="test.php?id=javascript:document.getElementById('myText').value;">
<input type="submit" value="Click"></a>
</form>
More information on forms: MDN
Whether you use GET or POST as a method, you'll be able to access the content of the form through PHP variables: $_GET, $_POST or the generic $_REQUEST.
More information in the PHP documentation
Note: PHP uses the name attribute of your HTML elements for those variables. Make sure to add this attribute to your HTML elements otherwise you'll have a hard time getting a value from $_REQUEST['myText']. I added the attribute holding the value "myElement" in the above code. It is accessible through PHP by typing $_REQUEST['myElement'].
Content sent through GET method is visible in the URL,
like this: www.example.com/test.php?var1=test&var2=test

<input type="text" id="myText" value="Mickey">
test

prevent button submit form onclick

I have a problem on html button tag
This my html code
<form name="data_kirim" action="confirm_order.php" method="POST">
..... order input field ....
<button class="back_button" onclick="window.location.href='keranjang.php'">Back</button>
<input class="next_button" type="submit" name="submit_data_kirim" value="Next"/>
</form>
How to prevent button to submit this form, because button is using the href to back page,
Can someone help me?

change
type='submit'
to
type='button'

<button class="back_button" onclick="window.location.href='keranjang.php'">Back</button>
<form name="data_kirim" action="confirm_order.php" method="POST">
<input class="next_button" type="submit" name="submit_data_kirim" value="Next"/>
</form>
A quick solution would be to move the back button outside the form since It's not using the form inputs anyway.

you can call a function in javascript when click your button, redirect to your link and return false or use preventDefault() function with jquery

<form onsubmit="return false;">

If you want to just make it link to another page and not submit the form then simply make it a normal button like so :
Next
This will not submit the form though.

Nothing happens with JavaScript form submission

Can anybody tell me Why I click on button to submit form -> it works, but when I use javascript to auto submit -> it failed ?
I have this form on aaa.com, it submit to bbb.com/result.jsp (another domain)
<form id="myForm" name="myForm " method="post" action="www.bbb.com/result.jsp">
<input name="var01" value="var01 ">
<input name="var02" value="var02 ">
<input type="submit" name="searchButton" value="Search">
</form>
Manually click on Search button, result.jsp works fine.
When I added following script, result.jsp page doesn’t work
<script>
document.getElementById("myForm").submit();
</script>

Your form has id="myForm" but your JavaScript is looking for myform. IDs are case-sensitive.
Changing that makes it work.

As I remember, the HTML id attribute is case-sensitive. You are calling the .submit() method on myform while your form id is myForm.

Submit form from a link with param

I'm trying and searching now for days and can't find an answer.
My problem is this: I use a Hyperlink and Javascript to submit a form, but I also need to submit a parameter with the link. The code looks like this:
<form action="Action.jsp" method="post" id="form-id">
<input .../>
...
<c:forEach items="${items}" var="item" varStatus="vs">
<a href="Action.jsp?id=${vs.count}"
onclick="javascript:document.forms['form-id'].submit(); return false">
${vs.count}
</a>
</c:forEach>
</form>
If I leave away the return false the param id is transferred but the other <input .../> parameters not and vice versa. How you see I can't use a <input type="hidden" .../> param, because I need only the param of the link.
If you please could help me, I would be grateful....

You need to add your parameter into the action property of form as well. This determines what URL the page is submitted to when submit occurs.
So you will probably need to use javascript to change this property value when the link is clicked to where it behaves like this.
<form action="Action.jsp?id=${vs.count}" method="post" id="form-id">
When you remove return false, what you are in essence doing is just getting the default behavior of the link after the form quickly submits.

If you add a hidden input outside the loop, you can set the value of that input before submitting:
<form action="Action.jsp" methode="post" id="form-id">
<input .../>
<input type="hidden" id="button-id"/>
...
<c:forEach items="${items}" var="item" varStatus="vs">
<a href="Action.jsp"
onclick="javascript:document.getElementById('button-id').value=${vs.count};document.forms['form-id'].submit(); return false">
${vs.count}
</a>
</c:forEach>
</form>

If you don't need to have anchors, you could solve this without JavaScript by submitting using button elements instead:
<button name="id" type="submit" value="${vs.count}">${vs.count}</button>
Note that Internet Explorer, prior version 8, will submit the text between the <button> and </button> tags, while other browsers will submit the value.