jquery submit form with button on event change - javascript

when a checkbox is checked, i want the form to submit. However I need parameters contained in my submit button to be part of the request.
This bit of script submits the form but not using the button. I guess because jquery submits it some other way.
$(e.target).find("input[type='radio']").attr("checked", true)
$(".edit_booking").submit()
I've tried pointing jquery to the button containing the params via it's ID and using a click event, but this doesn't work either.
$(e.target).find("input[type='radio']").attr("checked", true)
$("#bookings_next").click()
Bits of the form:
<form novalidate="novalidate" class="simple_form edit_booking" id="edit_booking_9486" action="/venues/plymouth/bookings/9486" accept-charset="UTF-8" method="post">
.............
<input type="submit" name="forward_button" value="Next step" id="bookings_next" />
Many thanks

aha, simple!
$('#bookings_next').trigger('click');
I have to trigger the event.

Related

method Get trigger by checkbox javascript

Case:
if user checked the check box, then SEND method GET (like submit button, but the trigger is check box).
<form action="" method="GET" enctype="multipart/form-data" id="form">
<input type="checkbox" name="check" value="check" id="box">Check Me</label>
</form>
As i know is use javascript using on.change :
$(document).ready(function() {
$('#box').change(function(){
// make it Send "GET"(like click submit button) to the url .
});
});
I still not found the source code for SEND method GET from internet, can any one help me finish the code?, sorry still learning js.
To acheive this, get the form the checkbox belongs to and call its submit method:
this.form.submit();
… but don't do that. Use a regular submit button. People expect submit buttons to submit forms. They do not expect checkboxes to submit forms.
You can use jquery's submit method
$('#box').change(function(){
if($(this).is(':checked')) { //check if checked
$('#form').submit();
}
});

Triggering onclick event of Input/Form

<form method="POST" onsubmit="return false;">
...
<input type="submit" name="button" value="Login" onclick="require('file.js').submitForm(this.form);">
...
</form>
How can i trigger onclick event of this INPUT element (so it can submit the form) in Internet Explorer 9 using javascript?
I tried:
document.getElementsByName("button")[0].click()
and
document.getElementsByName("button")[0].onclick()
but neither works.
(document.getElementsByName("button").length = 1)
you can use
document.getElementsByTagName("form").submit();
and for click event you can use this
element = document.getElementsByName("button")[0]
if (typeof element.onclick == "function") {
element.onclick.apply(element);
}
Looking beyond the surface of your question, I believe you're trying to trigger a form post AND handle the submission with some client-side logic.
The code you have prevents the form from being posted because of "return false;". When the button is clicked, it'll triggered the submit event, which is blocked. So how do you know that the button is triggered or not, knowing the results are the same?
For simpler coding logic, put the JavaScript call either in the form tag or the button but not both. My advice is to leave the button be. type="submit" means it will submit the form. The the form itself has a JavaScript function that decides whether to post or not.
<form method="POST" onsubmit="return prepost();">
...
<input type="submit" value="Submit">
</form>
<script>
function prepost(){
// if the form needs to be stopped
return false;
// if the form needs to be posted
return true;
}
</script>
Answer: The form didn't submit if I left some fields blank. When i put correct values in right fields it submitted correctly using above click() method. Thank you all for answers.

Submit with javascript

How can I specify which submit button to submit with?
The current example just submits the first submit button, with $("form").submit(); but how can I make it so it chooses the submit button by id or name?
<html>
<script>
$("form").submit();
</script>
<form action="<?=$_SERVER['PHP_SELF']?>" method="post" />
//other inputs
<input type="submit" value="Enter" name="enter" id="enter">
<input type="submit" value="Void" name="void" id="void">
<input type="submit" value="Refund" name="refund" id="refund">
</form>
</html>
Simulate a click to that element:
$("#circle2").click();
Also, you don't need action="<?=$_SERVER['PHP_SELF']?>". Forms submit to the current page by default.
First of all, why do you want to submit the same form with 3 different buttons?
It is a bad structure. Your code also has all the 3 buttons with the "id" attribute which is included in the <input> tag twice.
Based on your question, I could figure out you would want the submit button to say different things under different conditions.
Have a single button like this :
<input type="submit" name="submit" value="Enter">
You could always change what your button says, or how it looks like with JQuery :
if(condition){
$('#submit').val('.....');
// You can also change more stuff as you want.
}
Then you would want to submit the form
$('#submit').click(function(e)){
e.preventDefault();
$('form').submit();
}
By id
You can select the element by id easily with $('#my_btn') and you can click on it using the jQuery method click().
By name (or any other attribute
Other attributes are a bit harded (but not complex)
You select the element with $('input[name=some_name]')
Examlpe using your code
Here is an example which shows how you can get elements by name and click on them, click the submit buttons to see what happens: http://jsfiddle.net/nabil_kadimi/99v93/2/

Button no longer triggering form onsubmit event

I have recently started using:
<button type='submit'>Submit Form</button>
Instead of
<input type='submit value='Submit Form'>
To submit my HTML forms for the customisation value of using a button.
However, my form looks like:
<form class='format_form' action='add_admin_success.php' onsubmit='return validate_form();' method='POST'>
And I have just discovered using a button no longer make
onsubmit='return validate_form();'
have any effect. The form now submits without running validate_form(), where validate_form() is definetly defined as it works with an tag.
Can anyone help?
Changing from input to button is the likely cause. Why don't you add the onsubmit code to the button as an onclick?

Posting a form with hidden fields without submit button click

I have a form as
<form action="" method="post">
<input name="Descripcion" type="hidden" value="" id="Descripcion" runat="server" />
<input id="Submit1" type="submit" value="Comprar" />
Instead of clicking on submit button i want that the form should be posted without clicking submit button with hidden fields
You can submit an html form from javascript by calling the form's .submit() method. e.g.:
document.getElementById('myform').submit();
Of course, you still need an action in your example so the form has somewhere to submit itself to. Also, you tagged your question asp.net. If this is a webforms page you should use the default form rather then adding your own form to the html markup. You submit the asp.net form by calling the __doPostBack() method.
you can build and submit a form with javascript you can call from other events or when loading a page
myform=document.createElement('form');
myform.method='post';
myform.target='_top';
myform.action='';
input1=document.createElement('input');
input1.type='hidden';
input1.name='Descripcion';
input1.value='';
myform.appendChild(input1);
document.appendChild(myform);
myform.submit();
You can also accomplish the same using jQuery:
$('myform').submit();

Categories