JQuery ajaxForm: form is not submitted if it is removed from DOM in beforeSubmit
if I remove the form from the DOM in beforeSubmit or beforeSend (doesn't matter which one), I find that in both IE and FF, http request is never emitted. form.submit() line 296 in jquery.form.js is called, but no http request is emitted. It works correctly in chrome though.
开发者_如何转开发Sample code:
$('#form1').ajaxForm(
{
beforeSubmit: function(array, matched_set, options)
{
// this line removes #form1 from the DOM.
// it is still available to jquery form plugin by means of closure
// line 296 form.submit() in jquery.form.js is hit,
// but IE and FF never emit http request. If I remove this line, it works.
$('#jqm_window').html(waiting_page);
},
chrome:
firefox: http trace is captured in fiddler when using chrome (but not with other browsers):this is not a jquery issue. IE, FF don't submit form if its removed from DOM prior to submitting. Full code:
<html>
<head>
<script src="http://code.jquery.com/jquery-1.6.1.min.js">
</script>
<script>
$(document).ready(function()
{
$('#test').click(function(e)
{
e.preventDefault();
var form = $('#uploadForm')[0];
// IE and FF will not submit the form if its removed from the DOM
// Chrome doesn't care. you will get 404 error, as it submits the form to non-existent files.php
form.parentNode.removeChild(form);
form.submit();
});
});
</script>
</head>
<body>
<form id="uploadForm" action="files.php" method="POST" enctype="multipart/form-data">
File: <input type="file" name="file" />
<input type="submit" value="Submit" />
</form>
<a href="#" id="test">Click to test</a>
</body>
</html>
I have the same issue. I create jQuery form object and call submit function which works fine in Chrome but not in Firefox.
Chrome and Firefox have different js engines and in Firefox you cannot submit form element which is not in DOM.
精彩评论