jQuery form submitting in firefox

Question

Please, help me with one problem. I have this code, for submitting form via anchor.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <script src="js/jquery-1.3.2.min.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(document).ready(function() {
            $("#btnLogout").click(function() {
                $('#frm').submit();
                return false;
            });
        });
    </script>
</head>
<body>
    <form id="frm" action="/" method="post">
        <div>
            <p>
                <label for="txtLogin">Login:</label>
                <input name="txtLogin" />
            </p>
        <div>
           <a id="btnLogout" href="javascript:void(0)">выход</a>  
        </div>
        </div>
    </form>
</body>
</html>

It works fine on IE7,8, Opera and Google Chrome, but does not work on FireFox 3.5. I can not understand why it does not work?

What exactly doesn't work? Your form does not have an action and nothing is done in the submit function so it shouldn't do anything. — ryanulit, Feb 23 '10 at 15:29
@msi I wonder how can form work without sending any data to the server .. — ant, Feb 23 '10 at 15:36
@c0mrade if you have not any inputs on your form, it would not send any data to server. — msi, Feb 23 '10 at 15:47
@msi that makes no sense to me but ok, have you tried to submit that form without jquery by using submit button? first get that one going that its easy to use jquery/aajax or whatever .. — ant, Feb 23 '10 at 15:59
@c0mrade hm... it's very strange, byt simple does not work on my FireFox too. I'll try it in a few hours on my home computer — msi, Feb 23 '10 at 16:03
@msi I'm not really an ASP.net MVC guy .. but that is strange indeed.. — ant, Feb 23 '10 at 16:07
now I'm using for test clear HTML and submit button does not work — msi, Feb 23 '10 at 16:09
@msi I added form name , and submitted with ordinary submit button and it works .. — ant, Feb 23 '10 at 16:21
I've solved this. The problem was on FireFox URI. I've opened file form my HDD, so path was "file:///D:/Projects/HTML/jQuery/index.html" and it does not work. But when I deployed this file on hosting and had a path "http://localhost/test/index.html" it works fine. So this is problem of firefox openning files from HDD. — msi, Feb 24 '10 at 11:01

score 18 · Answer 1 · edited May 23 '17 at 12:17

18

Based on the answer to the same question here: Jquery Form.submit() on Chrome works but not in Firefox

Add the form object to the DOM before submitting:

$("#actionform").appendTo("body").submit();

edited May 23 '17 at 12:17

Community

1
1

answered Oct 27 '12 at 22:36

Jason

15,915
3
48
72

This does not work in Firefox 46.0.1 when the form gets modified via javascript before `submit()`. – basZero May 11 '16 at 12:16
Anyone having a solution for this? – basZero Feb 09 '17 at 08:57

younes0 · Answer 2 · 2020-05-04T17:51:19.677

3

According to this , manual submit with jQuery doesn't work under Firefox when the form has been added trough Javascript

The solution consists to clone the form and submit it :

$('#myform').on('submit', function(e) {
   e.preventDefault();
   if(navigator.userAgent.toLowerCase().indexOf('firefox') > -1) {
     $(this).clone().appendTo("body").submit(); // FF only
   } else {
     this.submit(); // works under IE and Chrome, but not FF  
   }

});

edited May 04 '20 at 17:51

answered Apr 29 '13 at 17:09

younes0

2,288
1
25
34

1

It seems that if you modify a form (that was **not** generated through javascript) via javascript you can also not submit it via javascript... Firefox becomes the new IE, it just sucks. – basZero May 04 '16 at 12:12
The problem with this solution is the `clone()` which does not clone the values of `textarea` and `select` items. Although there was a bugfix in 1.4.x for this, `clone()` still does not work in Firefox! Any solutions???? – basZero May 11 '16 at 12:11
You could try : https://github.com/search?l=JavaScript&q=form+clone&type=Repositories&utf8=%E2%9C%93 – younes0 May 11 '16 at 12:30
What shall I try? @younes0 – basZero Feb 09 '17 at 08:57

score 0 · Answer 3 · answered Feb 23 '10 at 16:28

0

This works for me :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <script src="http://code.jquery.com/jquery-1.4.2.min.js" type="text/javascript"></script>

    <script type="text/javascript">
  $(document).ready(function() {
    $("#btnLogout").click(function() {
      $("#actionform").submit();
         return false;
    });
  });
  </script>

</head>

<body>

<form id="actionform" action="something.html" method="post" name="forma">

        <label for="txtLogin">Login:</label>
        <input name="txtLogin" />
     <a href="#" id="btnLogout">Uno mas</a>  

</form>

</body>
</html>

answered Feb 23 '10 at 16:28

ant

22,634
36
132
182

this works for me too. But, when you'll try to use "/" before something.html, like this
it'll not work only on FireFox :(
– msi Feb 24 '10 at 10:04
@msi why would you use /something.html instead of something ? – ant Feb 24 '10 at 10:21
because I need to have access to this file from site root. And when I have site structure like this: /test/foo.html index.html somthing.html I'll not have an access to the somthing.html form /test/foo.html – msi Feb 24 '10 at 10:58
But on IE and Chrome all works fine. This is realy bug (or some security feature) in FireFox – msi Feb 24 '10 at 11:58

score -2 · Answer 4 · answered Feb 23 '10 at 15:57

-2

Try to include a submit button in your form. Even if it is hidden.

<input type="submit" style="display:none;" />

answered Feb 23 '10 at 15:57

Rexxars

1,167
8
10

score -4 · Accepted Answer · answered Feb 23 '10 at 15:36

-4

This may be a FF issue not related to jQuery directly. Try putting a filename in the action attribute like this:

<form id="frm" action="/index.html" method="post">

Just make sure to change index.html to whatever your default document is.

answered Feb 23 '10 at 15:36

palehorse

26,407
4
40
48

Odd, it worked for me. What is the actual file name that you are trying to post to? – palehorse Feb 23 '10 at 16:10
@palehorse I'm using ASP.NET MVC, so the actual is action method of some controller (the URL for action form method is "/Security/Logout"). But actin method does not go to this action, I've tried it via debugger. – msi Feb 23 '10 at 17:55
Does your routing table include a /default.aspx or something like that? If so, perhaps you could code the form rather than using a form helper to put the action in. You may also be able to add something to the routing table that will accept a /index.htm or some other default document name in order to do this. – palehorse Feb 23 '10 at 19:23
That's not an ASP.NET MVC problem, this is a FireFox problem, because all works fine on IE, Opera and Google Chrome – msi Feb 23 '10 at 20:36
I understand that it's a FireFox problem; however, sometimes to solve a problem with one technology we need to use another in a slightly different way. I've used jQuery's submit() method with MVC many times, but there's always been more than just a / in the action, that's why I suggest setting it up to use either a "file" name/route or something like that, anything to get away from the single "/" in the action. – palehorse Feb 24 '10 at 00:29
it's very strange, but when I tried to use action without slash (/):
submit works fine. Why?
– msi Feb 24 '10 at 09:50
It sounds like it could be a bug in FireFox. There's another bug dealing with a form that has an action beginning with a / that doesn't submit when "Enter" is pressed. It could be a related bug with slightly different behavior. – palehorse Feb 24 '10 at 15:07
Why is this flagged as solution? This here is the real solution to the Firefox problem: http://stackoverflow.com/a/16284382/356815 – basZero May 04 '16 at 12:18
This solution is wrong! Adding an action URL does not fix the problem. Firefox still does not submit the form if it got changed via javascript. – basZero Feb 09 '17 at 09:10

jQuery form submitting in firefox

5 Answers5

Linked