I am having two submit button on a form named 'Save' and 'Delete'. Now I want to explicitly do submit with Delete button. How can I do it?
I have tried following:
$('#myForm').submit();
and
$('#myForm').bind('Delete').submit(); // Delete is value of delete submit button.
but it don't work for delete functionality. Pls help.
Something like this:
$('delete selector').bind('click', function() { $('#myForm').submit() });
Do you have to use jQuery? Can you not make the delete button a submit type?
<input type="submit" name="delete" value="delete"/>
Or:
<button type="submit" name="delete">Delete</button>
Related
I am using two buttons in <form>. one for submit form and other for add categories to textfield.
<button id="catadd" class="btn-default" onclick="me()">+ Add Category</button>
<button name="submitcreate" id="submitcreate" type="submit" class="btn-default">
categories add to textfield using JavaScript. onclick="me()" for that.
but when i click on catadd button form submit too.
how stop it.
You need to set the type attribute to button
<form>
<button type="button">click me for some js logic</button>
<button>I am a submit by default !</button>
</form>
A button with no type attribute acts as type="submit", and will attempt to submit form data when clicked.
So, the simple solution of your query would be to specify the type of the "categories add" button like:
<button id="catadd" class="btn-default" onclick="me()">+ Add Category</button>
More details here: https://dev.to/clairecodes/why-its-important-to-give-your-html-button-a-type-58k9
I am clicking a submit button using this:
Hlml :
<button type="submit" class="btn btn-submit">Submit</button>
Js :
$("#form_id").on('submit',(function(e) {
The problem is that I have more that 1 submit button on my form wizard so I need to target a specific submit button.
LIke
<button type="submit" id="submit_form" class="btn btn-submit">Submit</button>
How could I submit form using id="submit_form and $("#form_id") ?
You could attach click event to the button you want using the specific id attribute :
$("#form_id").on('click', '#submit_form', function(e) {
e.preventDefault();
//You logic here
//Submit form at the end if you want
//$("#form_id").submit();
});
Hope this helps.
I have following two buttons:
<button type="submit" id="gform_submit_button_1">Submit</button>
<button type="button" data-is_quote="1" data-button="simple_add_to_quote" data-product-type="simple" data-product-id="75448" id="add_to_quote">Submit</button>
the #gform_submit_button_1 button validates form entries before submitting data to the server
and the #add_to_quote button submits form data without validating it
I want to be able to validate the form & submit it using the #add_to_quote button. Any solution?
Trigger click event of gform_submit_button_1 button on click of add_to_quote.
$("#add_to_quote").click(function() {
$("#gform_submit_button_1").click();
});
I'm not sure that I get the problem right, but here is a possible solution :
Create a form element with an hidden input containing all the data-X values and a submit button that submits the form.
<form method="GET/POST" action="validation.php">
<input type="hidden" name="data-validation" data-is_quote="1" data-button="simple_add_to_quote" data-product-type="simple" data-product-id="75448" id="add_to_quote">
<input type="submit" value="submit" id="add_to_quote">
</form>
I hope it will help !
#Dhara Parmar solution is fine... but is missing the event.stopPropagation() and event.preventDefault() like this:
$("#add_to_quote").click(function() {
$(this).preventDefault(); //to stop submit
$(this).stopPropagation();//to avoid the event bubbling up to other submit buttons, if any...
$("#gform_submit_button_1").click();
});
you can call the validation and submit functions of the form directly from the type=button click handler to make it behave like a type=submit
$("#add_to_quote").click(function () {
if (!$("#TheForm").validate()) { //native validation triggered
return false;
} else {
$("#TheForm").submit()
}
});
In PHP program, I have JS function which validates submit <form ...onsubmit='return isOK();'>. It works OK. The problem is I want it to work only for particular submits, not for all. Is there any way inside the JS function to find out which submit was pressed, or some PHP trick
instead of onsubmit u can use onClick.
<input type="submit" onclick="return pressSubmit1()" value="submit1" />
<input type="submit" onclick="return pressSubmit2()" value="submit2" />
<form action="action.php" method="post">
...
<input name="submit" type="button" value="check me" onclick="submitform('check')" />
<input name="submit" type="button" value="do not check me" onclick="submitform('not check')"/>
</form>
in javascript:
function submitform(check)
{
if(check=='check') checkfrom();
}
in PHP
if($_POST['submit']=="check me")
checkform();
<form class="allowed" onsubmit='return isOK();'>
----
function isOK() {
if($(this).hasClass('allowed')) {
// Do stuff
}
}
your question is not clear, are you using a single submit button or different ones. If you're using different submit buttons then ofcourse you can make checks based on the id of the submit button. On the other hand if is a single submit button then it depends on what the conditions are for submitting or not submitting
It's better you write some HTML and Java Script code which you are using. So, it's easy to correct mistake is you have made somewhere in code snippet.
We can check which submit button is clicked, using PHP.
In the PHP page corresponding to the form submit, write
if(extract($_POST) && isset($submitbtn1)) {
// some validation for first submit button
}
elseif(extract($_POST) && isset($submitbtn2)) {
// some validation for second submit button
}
Note: we can use $ followed by submit button name inside the extract function. ie. $submitbtn1 is same as $_POST['submitbtn1']
Yes different onclick looks fine as mentioned in the accepted answer. But in the event handler you should have the
code as below. Note the preventDefault.
Also since submit is A button that submits the form. You can use button type instead of submit type and then there is no need for preventDefault. Here is the link of the code http://jsbin.com/wikose/4/
function testlogin(){
event.preventDefault();
var test = 'not validated';
if(test === "validated")
alert("not valid login");
else
$('form').submit();
return false;
}
I want to submit and redirect a form using jquery.I have tried to do it but redirect does not works, here is my code. The problem is i have two submit buttons in my form and both are redirecting to other page when i set the action=".....php".But i do not want update cart button to redirect to any other page so i want to use jquery for submitting and redirecting form. Please give me some solution. Thanks...
<script type="text/javascript">
$(document).ready(function(){
$('#updateCart').click(function(){
$('#form1').submit();
window.location.href='Checkout.php';
});
});
</script>
<form name="form1" method="post" id="cartform" class="clearfix" action="#">
<input type="submit" id="updateCart" value="Update Cart" class="btn-txt" name="update" onclick="update_cart()">
<input type="submit" class="checkout-button btn" name="checkout" />
</form>
You should do e.preventDefault(); on the update cart button and then fire the function that updates the cart.
Something like this:
<script type="text/javascript">
$(document).ready(function(){
$('#updateCart').click(function(e){
e.preventDefault();
updateCart();
});
});
</script>
You wouldn't want to fire the form submission when the "update cart" button is pressed, only when the "checkout" button is pressed.
Your approach is OK but you need to decide which button is your official form "submit" button, and which is attached to a jQuery function to update the form before submitting.
I would recommend that you don't do any javascript for your main "Checkout" button as you will want this to go to a payment page where you capture payment details - i.e. the form will follow it's action="checkout.php".
For your "Update Cart" button follow APAD1's answer and adapt it to your needs. If you're going to be updating form fields you'll need to think about using JSON-encoded returned data...
You could just make it an html button that doesn't submit by setting it's type to "button" and then it will just run the javascript when clicked. Then you can put the action attribute back on your form and it will only submit for the checkout submit button.
<button type="button" id="updateCart" class="btn-txt" name="update" onclick="update_cart()">Update Cart</button>
add id or class in form tag
<form id="form1" ...>
change submit button to anchor
<a id="submitAnchor"> ... </a>
and in javascript submit the form and redirect the user as well
$("#submitAnchor").click(function(){
$(".form1").submit();
setTimeout(function() {
window.location = 'your URL';
}, 1000);
});