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.
Related
Not sure how I did this last time or else I wouldnt asking here but here is what I'm trying to do.
I have the usual basic form with a javascript function that will submit the form. Question is that after the form is submitted, I have an if statement in PHP that echos a that the form has been submitted. Any help would be greatly appreciated.
//PHP
if($_POST['submitDelete']){
echo "welcome, You form has been submitted";
}
//HTML
<form id="form_id" action="" method="POST">
First name: <input type="text" name="fname"><br>
Last name: <input type="text" name="lname"><br><br>
<input type="hidden" name="submitDelete" TYPE="submit">
</form>
<button type="button" onclick="myFunction()">Submit</button>
//JAVASCRIPT
<script>
function myFunction() {
document.getElementById("form_id").submit();
}
</script>
I can't seem to trigger the if statement in PHP. I also tried using the form name in the if statement and that didnt work either.
A form element must be told where to submit its data to when the submit event takes place. This is accomplished by setting the action attribute value for the form. Leaving that attribute empty does not implicitly set the form to post back to the current page. So, if you want to have a single page form/form processor, you need the action to be set to the current page file name:
<form action="currentPageFileName.php" method="post">
Next, there's no reason a single page can't have multiple forms on it. In that case you would need multiple submit buttons, each tied to a specific form. For this reason, you can't just drop a submit button anywhere on the page that you like unless you add the form attribute to the button to tie it back to the form it is supposed to trigger the submit for. Also, if you simply place the submit button within the form element it "belongs" to, you don't have to worry about this.
Also, you have some invalid HTML with:
<input type="hidden" name="submitDelete" TYPE="submit">
An element may not have the same attribute repeated within it (the case that you type the attribute in makes no difference since HTML is not case-sensitive). So, that code would wind up simply creating a submit button.
Lastly, if all you want to do with your submit button is cause its related form to be submitted, there is no need for JavaScript at all. That is what submit buttons do by default.
So, in the end, you can get rid of the JavaScript in your code completely and change your HTML to this:
<form id="form_id" action="currentFileName.php" method="POST">
First name: <input type="text" name="fname"><br>
Last name: <input type="text" name="lname"><br><br>
<input type="hidden" name="submitDelete" value="true">
</form>
<button type="submit" form="form_id">Submit</button>
As i know, all hyperlink working as GET method. But I wanna make a hyperlink which should be in POST method instead of GET Method <a href='targetpage'>click</a>
Note: I don't want to submit any form. I SHOULD BE ONLY <a> TAG
So is it possible?
Thanks
The post method can only be used by form data if called by html.
So the only solution would be to make a form and hide the inputs which you want to post, and submit the post to the url you want to.
You can do like this,
<form id="form" method="post" action="target.html">
<input type="hidden" name="name" value="value" />
<a onclick="document.getElementById('form').submit(); return false;">click here</a>
</form>
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.
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.
I have an input text box and a search submit button, and when user clicks the Search submit button, I want to redirect user to url http://testsearch/results.aspx?k=<value of text box k>, for example, if user put "StackOverflow" into text box and then clicks the search button, I want to redirect user to the following page,
http://testsearch/results.aspx?k=StackOverflow
I find when I use button for Search button, it works (see below source codes),
<input type="text" id="k" name="k" />
<input type="button" id="Go" value="Search" onclick="location.href = 'http://somemachine/Search/results.aspx?k='+document.getElementById('k').value;"/>
but when I use submit for Search button, it does not works (see below source codes), why?
<input type="text" id="k" name="k" />
<input type="submit" id="Go" value="Search" onclick="location.href = 'http://somemachine/Search/results.aspx?k='+document.getElementById('k').value;"/>
thanks in advance,
George
You can even use the submit button this way:
<input type="submit" id="Go" value="Search" onclick="document.location='http://testsearch/results.aspx?k=StackOverflow'; return false;" />
Semantically submit button is used to submit forms not redirect pages. You should use normal button type for this. However as i showed you can use the submit button too but that is not semantic i think.
The below line prevents the form from being submitted.
return false;
That is what you are missing in your code :)
Thanks
<button>-elements and <input type="button"/> don't do anything by default, unless you tell them to do something with Javascript.
<input type="submit"/> will submit the form it is in.
So, if <input type="submit"/> won't work, you got it probably not in the <form/>-element itself.
If that's the only field in your form, simply set the form's method to "get" and it'll work.
<html>
<body>
<form action="http://localhost/mytest" method="get" >
<input type="text" id="k" name="k" />
<input type="submit" id="Go" value="Search" />
</form>
</body>
</html>
<button> means "put a button in the page and do whatever the onclick event says". So if you don't write an onclick handler the page doesn't do nothing.
If you use submit is ok, because you want to redirect to another page.
If you want to use button anyway you can do this way:
<script>
function doTheSearch() {
// do the submit mannually
document.getElementById('myForm').submit();
}
</script>
<form id="myForm" action="results.aspx">
<input type="text" id="k" name="k" />
<input type="button" id="Go" value="Search" onclick="doTheSearch();" />
</form>
Warning: submit button with onclick
If you have a submit button (inside a form, it is, a working submit button) with an onclick event, some browsers will:
1) execute onclick
2) execute submit
your onclick tries to redirect but the submit button wins.
If you want to avoid it you have some options:
a) change submit button to normal button
b) avoid the submit thing (add onsubmit="return false;" to form element)
c) use the submit procedure (form action="..." method="get", no onclick event), the browser will be happy and you can control the submit in the onsubmit event (you can cancel it or not).
make sure you got the input's in a form tag with a GET method:
<form action='http://testsearch/results.aspx' method='GET'>
... inputs
</form>
If I'm understanding correctly, it is not working because it is not in a form tag. If you put it in a form tag with method="get" it should work. The button works because it does not have to be in a form.