2

I am unable to get jQuery's .submit() to work in IE or Firefox when I pass the form as text for the jQuery object.

For example, the following code works in Chrome and Safari, but in IE and Firefox nothing happens--no errors, no nothing:

$('<form id="frm" action="http://www.stackoverflow.com" method="POST"></form>')
    .submit();

NOTE: "http://www.stackoverflow.com" above and the empty form is just an example. In my application, my form has a legitimate URL for "action=" that accepts POST data that I specify as hidden controls within the dynamically constructed form.

If I instead load the constructed form into an element in the html and then execute $('#frm').submit(), it works; however, I would rather not go that route.

Is this known/expected behavior or am I doing something wrong?

~ ~ ~

In response to @DavidThomas, I am constructing the <form> via a .get() call to a ASP .NET .ashx handler. I am attempting to minimize exposure to the <form> and it's contents. 

$.get('./ConstructForm.ashx', function (data) { $(data).submit(); })
    .fail(function () { alert('fail!'); });

I certainly welcome recommendations for a more secure way to do this, but that would probably be a subject for a different question.

~ ~ ~

For what it's worth, my approach was initially based on this: https://stackoverflow.com/a/2054741/1530187

I am attempting to do this using a constructed string for the jQuery object, instead of an existing element, in an effort to minimize the user's ability to inspect the form prior to submit or after submit via the browser back.

Community
  • 1
  • 1
jweekes
  • 155
  • 1
  • 3
  • 9
  • 4
    It has to be part of the DOM before it will work. Otherwise its just a fragment not attached. – prodigitalson Feb 19 '13 at 23:29
  • This may be for security reasons or something else, but I guess IE/FFX will not submit forms that are not in the current document. You could just append it to `` and then submit it at once. – Explosion Pills Feb 19 '13 at 23:30
  • 1
    `$('')` *creates* a form; it doesn't add it to the document. Until it's attached the `submit()` handler won't/can't do anything. It can't be submitted until it's available to the user. Also, only successful form elements are submitted to the server; since your form doesn't contain any elements there's nothing to submit. So...hopefully you just picked a really bad way to represent your use-case. What have you *really* got? – David Thomas Feb 19 '13 at 23:30
  • 1
    @DavidThomas: Why does it work on Chrome? Or is Chrome's behavior wrong? – Blender Feb 19 '13 at 23:32
  • @Blender: I honestly have no idea, which is why I'm hoping/speculating that this is just a bad representation of what he's really doing. – David Thomas Feb 19 '13 at 23:36
  • @DavidThomas I've updated my question text with an example closer to what I'm actually doing. – jweekes Feb 19 '13 at 23:50
  • There's no way to force a browser to submit if it's against its security model. I would suggest a change of approach and get the appropriate values from the form node and submit the form manually via XHR, or a location.href rewrite if your intention is to redirect. – Luke Channings Feb 20 '13 at 00:10
  • Thanks, @LukeChannings. My intent is to redirect, but with a submit/post. – jweekes Feb 20 '13 at 00:54

1 Answers1

0

You should put the form into the HTMl,code like below

var yourform = $('<form id="frm" action="http://www.stackoverflow.com" method="POST"></form>');

yourform.attr('target', '_blank');  //open in a new tab
yourform.appendTo($(document.body)); // put your form into html
yourform.submit();

It works in IE and Firefox.

jayxhj
  • 2,829
  • 1
  • 19
  • 24