Reputation: 13166
I have a form like this :
<form id="myform" action="something.php" method="post">
<input type="text" name="first_name" /><br />
<input type="button" id="submit" value="Send" />
</form>
I want to submit this form after getting successful message from some processes in JavaScript and jQuery. So I did it like this :
$(document).ready(function(e) {
$('#submit').click(function(event){
event.preventDefault();
$.post('process/process.php',
{
// I passed data here
},
function(data) {
if (data.result == '1') {
$('#myform').submit();
} else {
alert('Error #'+data.result+' occurred!');
}
},
'json'
);
});
});
But even after getting data.result == '1'
, the submitting form does not work. What's the problem here ?
Edit:
I've changed jQuery to :
$(document).ready(function(e) {
$('#submit').click(function(event){
$('#myform').submit();
)};
)};
So there is no condition now, but form did not submit.
Upvotes: 1
Views: 24801
Reputation: 5916
From the jQuery documentation for .submit()
,
Additional Notes:
Forms and their child elements should not use input names or ids that conflict with properties of a form, such as submit, length, or method. Name conflicts can cause confusing failures. For a complete list of rules and to check your markup for these problems, see DOMLint.
Rename the id of the second input to submitForm
or something similar.
Working fiddle: http://jsfiddle.net/WvSdX/
Upvotes: 5
Reputation: 9242
I think it's a matter of a value-comparison issue here. to give us a better way to determine if this is the case, can you temprorly change the callback to this and give it a try?
$(document).ready(function(e) {
$('#submit').click(function(event){
event.preventDefault();
$.post('process/process.php',
{
// I passed data here
},
function(data) {
$('#myform').submit();
},
'json'
);
});
});
if the form get submitted, then there is nothing wrong with the jQuery part, it's a matter of correctly getting the result out of your post() operation.
Please give it a try and let me know if it's working or not.
Upvotes: 0