var makeField = function(name, value) {
return $('<input />').attr({
type: 'hidden',
name: name,
value: value
});
};
$('.login').on('click', function() {
var form = $('<form />').attr('method', 'POST');
form.append(makeField('n0', 'data1'));
form.append(makeField('n1', 'data2'));
form.append(makeField('n2', 'data3'));
$(document).append(form);
form.submit();
});
The above code works fine in Safari, Chrome and Opera but firefox ignores form.submit();
. I tested the above code by adding console.log('...');
above and below the submit call, and it executes without error. I also tried calling $(form).submit();
, and I get the same unwanted result.
Has anyone ran into this before, or have a solution?
The NUMBER ONE error is having ANYTHING with the reserved word submit as ID or NAME in your form. If you plan to call . submit() on the form AND the form has submit as id or name on any form element, then you need to rename that form element, since the form's submit method/handler is shadowed by the name/id attribute.
The JavaScript form submission can be used for object creation and various attributes can also be used. The attributes can be class, id, tag, etc. Calling by attributes is quite simple, we just need to place the symbols properly.
Updated with your new code
$(function() {
var makeField = function(name, value) {
return $('<input />').attr({
type: 'hidden',
name: name,
value: value
});
};
$(document).on('click', '.login', function() {
var form = $("<form />").attr({ method: "POST" }).append(
makeField('n0', 'data1'),
makeField('n1', 'data2'),
makeField('n2', 'data3')
);
// just adding a callback on submit here to show it works
form.submit(function(e){ alert("Submitting Form"); });
$("body").append(form);
form.submit();
});
})
See WORKING jsFiddle in FF HERE
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With