Search code examples
javascripthtmlformsinternet-explorer-9firefox-5

"Submit is not a function" error in Firefox in dynamically CREATED form without other submit inputs


In Firefox 5's error console (but not in IE 9) I get the error "myForm.submit is not a function" when I call the following javascript function (in an external script file):

function go(url_go, arr_POST_vars, str_method) {
  var str_method = str_method || "POST";    // by default uses POST
  var myForm = document.createElement("form_redir");
  myForm.setAttribute("method", str_method);
  myForm.setAttribute("action", url_go);
  for (var key in arr_POST_vars) {
    var myInput = document.createElement("input");
    myInput.setAttribute("name", key);
    myInput.setAttribute("type", "hidden");
    myInput.setAttribute("value", arr_POST_vars[key]);
    myForm.appendChild(myInput);
  }
  document.body.appendChild(myForm);
  myForm.submit();
}

The only HTML on my page (between the HTML body tags) is the following line:

<button type='button' onClick='javascript:go("http://www.testsite.com/login.php", {userCode:"2487",password:"jon123"}, "POST");'>Go!</button>

I have Googled extensively, and I know that this error occurs when there is a form input which is also named "submit", which then clashes with the "submit()" function name of the form. However this is not the case here.

The idea here is to navigate and submit POST values to a specific url when the button is clicked, by creating a form dynamically. It works fine in IE but not Firefox.

I am at a loss and a solution will be deeply appreciated.


Solution

  • Its caused in the type of element you've created. "form_redir" is no valid html tag so it created an element but it has only the default dom methods. Change it to "form" and it will work.