i have 2 or more forms in one page. like this:
<form method="post" >
<table border="0">
<tr>
<td> </td>
<td> </td>
</tr>
</table>
<input type="submit" value="get" />
</form>
<form method="post" >
<table border="0">
<tr>
<td> </td>
<td> </td>
</tr>
</table>
<input type="submit" value="get1" />
</form>
the forms are similar but with different content.
what happens is when i click the get button on one form, all other forms get triggered also.
is there a way to differentiate the forms so that when i click on a button only the form that has that button to get triggered?
edit: if i press on get1 the form with get gets also triggered
thanks
Only the form which contains your submit-button should be triggered. Are you sure you closed both forms properly in the HTML?
Can you post a link to the page or paste all the HTML?
If your code is set like...
if(!empty($_POST)) {}
then it'll seem like both forms are submitted, but really you can only access data from the form that was actually submitted. If you put a name on the two submit buttons you can test for $_POST['submitButtonName'].
You can use this page to see the differences pretty easily.
http://pastie.org/pastes/2290937/text
You can't submit more than one form, your first form is just probably wrongly closed, which causes you a trouble
Hope this code will help you.
If you want to submitt particular
form use javascript or jquery.
In my case i will choose jquery.
Here is the example of my solution.
You will need to change formid and objectid.
$( "#buttonid" ).click(function() {
$( "#formid" ).submit();
});
The short answer is you really only have one form on your page.
You should give each of your forms a name and id to uniquely identify them.
<form name="form1" id="form1" method="post" action=""> is the way to make each of your forms different. It is important because you may want controls other than a submit button to submit the form. Consider this code in the OnChange event of a dropdown list:
"document.forms.form1.submit()"
This will make the form submit as soon as a value is picked in the dropdown list. For advanced features to work, you need to know what your form's name is. The id for the form can be used to access it using document.getElementById('form1')
Finally, do not use tables to display your forms. Use CSS.
I hope this helps someone.
Related
I am trying to pass a GET parameter through a button but I can't figure out what I am doing wrong. The parameter is set, as it shows up fine in the header, but it isn't being added to the edit.php url. The button is directing me to edit.php, just without the GET parameter added. I am pretty new to this stuff and this is my first time using links that aren't through anchor tags, so I am clearly missing something here. Any advice is greatly appreciated.
<h1 class="headerWithButton">Claim #<?echo($_GET['claim_id'])?>
<form>
<button type="submit" formaction="index.php" class="backButton">Back</button>
<?echo('<button type="submit" formaction="edit.php?claim_id='.$_GET['claim_id'].'" class="editButton">Edit</button>');?>
</form>
</h1>
When you submit a form using the GET method, any existing query string in the action will be replaced by a new one generated by the name and value of the successful controls associated with that form.
In your case, the only successful control is the submit button, which doesn't have a name or a value.
You could get the effect you desire by moving the data to those attributes:
<h1 class="headerWithButton">Claim #<?php echo htmlspecialchars($_GET['claim_id']); ?>
<form>
<button formaction="index.php" class="backButton">Back</button>
<button formaction="edit.php" name="claim_id" value="<?php echo htmlspecialchars($_GET['claim_id']); ?>" class="editButton">Edit</button>
</form>
</h1>
Important security note: inserting data from the URL directly into a page makes you highly vulnerable to XSS attacks. You need to take precautions against that. The most basic of those is using htmlspecialchars.
Note, however, that it isn't really appropriate to use a form here. Your form buttons are not submitting any data the user has entered, nor performing any kind of action. The affordances offered by buttons are misleading here.
You can, and should, use regular links instead.
<form method="get" action="edit.php">
<?echo('<button type="submit" formaction="edit.php?claim_id='.$_GET['claim_id'].'" class="editButton">Edit</button>');?>
</form>
instead of using the form you can just use a straightforward link
k with the anchor tag
edit
or you can specify the methos of get on the form with a hidden for input to place the link get parameter
If you have to use formaction, you must specify name and value of element:
<h1 class="headerWithButton">Claim #<? echo($_GET['claim_id'])?>
<form>
<button type="submit" formaction="index.php" class="backButton">Back</button>
<?php echo('<button type="submit" formaction="/edit.php" name="claim_id" value="'.$_GET['claim_id'].'" class="editButton">Edit</button>');?>
</form>
here it is better to place buttons in different blocks. But personally, in this case, I use a hyperlink
<form method="get" action=""></form>
<?echo('Edit
I find the easiest way to pass values with a button is to just wrap a form around the button.
$id = $_GET['claim_id'];
echo <<<EOT
<form action="index.php" method="get">
<button>Back</button>
</form>
<form action="edit.php" method="get">
<button name="claim_id" value="$id">Edit</button>
</form>
EOT;
I tried searching this but found no good solution.
My question is I have a HTML form with few text boxes. Once the user enter details and press submit I want to send this same HTML form to administrator email. The problem is I can not get the HTML markup with values. Is there any suggestion.
example
<div id="user_form" action="" method="post">
<form onsubmit="return validate_me();">
<table>
<tr>
<td>Name</td>
<td><input type="text" name="test" id="test"/></td>
</tr>
<tr>
<td colspan="2">
<input type="submit" name="send" id="send" value="Send"/>
<input type="hidden" name="html_data" id="html_data"/>
</td>
</tr>
</table>
</form>
</div>
So once user click on send button I want to send whole form with values to server then I can send it to admin email. How can I do that.
I tried following
<script type="text/javascript>
function validate_me(){
("#html_data").val($("#user_form").html());
}
</script>
But above send only markup without text box value.
Only above works in IE 9. fail in safari 5.1.7 and FF 23
Any suggestion would be greatly appreciate. Also I tried output buffering but I also did not help to send form element's values.
just submit your form
function validate_me(){
$('#user_form form').submit();
}
note: add action attribute to your form tag
Your updated code try this 1 and let me know if it not works.
<div id="user_form" >
<form onsubmit="return validate_me();" method="post" action="SOME_ACTION_URL">
<table>
<tr>
<td>Name</td>
<td><input type="text" name="test" id="test"/></td>
</tr>
<tr>
<td colspan="2">
<input type="submit" name="send" id="send" value="Send"/>
<input type="hidden" name="html_data" id="html_data"/>
</td>
</tr>
EDIT
<script type="text/javascript>
// on ready fill the value and then submit it
jQuery("document").ready(function () {
jQuery("#html_data").val($("#user_form").html());
})
function validate_me(){
// YOUR code MUST be return
return true;
}
</script>
I've just noticed this same problem. What I wanted to do was switch one form with another form yet retain the values the user has entered into the form, such as a message. I tried outputting the form via console.log and noticed all of the form shows up except the user entered data.
I was attempting to have a second form appear to make sure the user agrees to what they are about to do with a button to go back and make changes. I redisplayed the original form and TADA David copperfield magic, the form is there without any of the content in the inputs. (a text input and textarea)
I am not sure why this happens, I am guessing all I can do is store the user entered data in a namespaced global before trying to save the form data, then redisplay the form and replace the users content one field at a time.
What is the reason for this does anyone know? It must be something about how the inputs work in browsers.
I have a datagrid with bulk actions to delete as well as single delete.
Here is the snapshot of my datagrid:
my datagrid is as follow :
<form method="post" action="">
<table>
<tr>
<td><input type="checkbox" value="1" name="checkIds[]"/></td>
<td>user</td><td><img src="delete.png"/></td>
</tr>
</table>
</form>
I can submit data as post when using bulk action delete. Currently for single delete using the delete button action as you can see in the Action column, i am just putting hyperlink or sending it as GET request. As i came to know, the delete action should use POST or DELETE to avoid web crawlers accidentally deleting my data. I thought of a solution to send it as POST action as follow:
<form method="post" action="user/delete/1" id="form_id_1"></form><img src="delete.png"/>
Problem is that this form tag will be inside my parent form tag and it violates html standards since form tag cannot be inside another form tag
How can I send post request for single delete action here ? Any logic please?
Try:
<form method="post" action="">
<table>
<tr>
<td><input type="checkbox" value="1" name="checkIds[]"/></td>
<td>user</td><td><input type="submit" class="sdelete" name="sdelete" value="<?= $ID; ?>" /></td>
</tr>
</table>
</form>
From there, you would use css to modify how the .sdelete looks, and in PHP you can get the single delete by:
if(isset($_POST['sdelete'])) {
$id = $_POST['sdelete'];
//use $id to delete a single entry from DB, and then produce new output
}
And that should work flawlessly. ^^
Don't add another form. Just add another submit button. Use the same form handler, and have it check to see if any of the "delete me" submit buttons are in $_POST (which will only happen if they are clicked).
You'll have to use POST for all your actions though.
I came of with a solution as below . please correct me if i m doing it wrong
<form method="post">
<table>
// datagrid
<img src="delete.png"/>
</table>
<input type="hidden" value="" name="id"/>
// to distinguish between single delete and bulk delete
<input type="hidden" name="single_delete" value="" id="single_delete_flag"/>
</form>
//js
//onclick handler for anchor action delete:
$("#id").attr("value",$(this).attr("data"));
$("#single_delete_flag").attr("value","1");
$("form").submit();
//delete.php
check if request if post
check if single_delete is 1, then single delete
else if check bulk delete
I am trying to submit a form with jQuery and I must be missing something small, because I can't get this to work, and from everything I see it should work fine.
What's wrong with this?
<table class="newrecord"><form id="editthis" action="page.php" method="post">
<tr><td class="left">Name:</td><td><input type="text" name="name" id="name" /></td></tr>
<tr><td class="left">Company:</td><td><input type="text" name="company" /></td></tr>
<tr><td class="left">Cancel</td><td><input type="button" name="submit" class="subbut" id="subthis" value="Update" /></td></tr>
</form></table>
And the javascript:
$("#subthis").click(function() {
$('#editthis').submit(); // An alert box works, so I know this is triggering
});
As mentioned in the code, an alert box works if I click the submit button, but when I use the jQuery submit function, nothing happens. What am I missing???
You don't need to use jQuery to submit a form. It's default behavior for a submit button to submit the form it belongs to.
Also, don't use a table for layout. The form elements themselves can layout just fine.
<form id="edit_this" action="page.php" method="POST">
<label>Name <input type="text" name="name"></label>
<label>Company <input type="text" name="company"></label>
Cancel
<button type="submit">Update</button>
</form>
Can be easily layout'd and will submit on its own.
If you need something to happen before the submission with jQuery, bind it to the form's onsubmit handler, rather than the actual click of the button.
The actual problem is the collision between the name you've given to the button and the reserved word in JavaScript. Don't use submit as the name.
I see two possible problems.
1) You have form tags inside table tags. While this probably isn't the root cause of your problem, it's not valid HTML.
2) You've used "submit" as the name of your submit button. This should be avoided because your object will collide with JavaScript reserved words. Use something other than "submit" like you've done with the id attribute.
I try to create an upload progress bar with PHP and jQuery. However, I have a problem when I bring it to the form data. The code is similar like this:
<form method="post" action="upload.php" enctype="multipart/form-data" id="upload-form" target="upload-frame">
Suburb:<input type="text" name="txtSuburb" id="txtSuburb">
Picture:
<input type="hidden" id="uid" name="UPLOAD_IDENTIFIER" value="<?php echo $uid; ?>">
<input type="file" name="file">
<input type="button" name="submit" value="Upload!">
<iframe id="upload-frame" name="upload-frame">
</iframe>
<input type="submit" name="DataSubmit" value="Submit Data"/>
</form>
As you can see, I got 2 submit buttons. If I keep the form like this then the form can't submit data to server. It just submits the file to iFrame. If I change the action and target of the form then the upload progress function will not work.
Could anyone please help me to find the solution for this?
I want the user can click on upload button to upload their file. Then they can take the rest to fill the form. When everything is done, they can click on another submit data button to submit their data (included the file) to the server.
Make sure that you have only one input element of type submit within your form.
If you want the first button to trigger some Javascript, use a regular input element or even a styled link and attach a Javascript event to it's onclick event, then prevent it's default behavior, e.g. by returning false.
Like this only the second button will actually submit your form which should do what you're describing.
In general I'd second #Treffynnon's suggestion to use a existing library for this purpose. These hacks have a tendency to get pretty nasty, especially when it comes to crossbrowser compatibility.