Jump to content


Firefox Submitting Form

  • Please log in to reply
3 replies to this topic

#1 JackNorrisRD



  • Members
  • Pip
  • 1 posts

Posted 13 April 2012 - 9:33 PM


I have 3 of your books and am considering 2 more. Thanks!

I have really been struggling with AJAX.

One of the main things that is causing me problems is that Firefox insists on submitting the form(s) even when I return a "false" from the javascript. The only way I have been able to stop this is by getting rid of the submit inputs which means I have to use workarounds, like a button input, for all the scripts from your book to deal with the changes to the form. I have been able to get an autocomplete search to work, so I'm not completely failing, but this has become more problematic with the scripts to add a record to a database table.

This is what I currently have for one of my scripts:

record add form:

<form method="post" id="member_add_form_ajax" onsubmit="member_add_xml()">

<input type="submit" value="Add Member" >

..text field inputs....


Then for the javascript:

function member_add_xml()
// Calls the ajax object from ajax.js
var member_add_ajax = getXMLHttpRequestObject();

// Check for ajax object; if none, don't use AJAX
// Check to see if the page has an element with an id of "results"
//window.alert('hello 1');

return false;

It reaches the window.alert, so I know it's getting that far. But the form submits.

Obviously, this code doesn't do anything, I've taken out everything between the window.alert and the return false; so that I can see if I can get the form to stop submitting without anything to trip it up.

If I could at least get the form to stop submitting, I would then not have to modify your scripts so much and could possibly get it to work.

Thank you for any help!

  • 0

#2 HartleySan


    Advanced Member

  • Members
  • PipPipPip
  • 3042 posts
  • LocationColumbus, OH USA

Posted 13 April 2012 - 11:12 PM

Jack, the reason it's not working is because you need to set up an onsubmit event handler for the form. Here's a basic example that will work in Firefox.
(Please note that this example will not work in IE, because of the way I'm setting up the Ajax object.)

<!DOCTYPE html>

<html lang="en">
    <meta charset="UTF-8">
    <title>Ajax form submit test</title>
    <form action="#" method="#" id="theForm">
      <input type="text">
      <input type="submit" value="Submit">
      var ajax = new XMLHttpRequest();
      document.getElementById('theForm').onsubmit = function () {
        if (ajax) {
          // Make your Ajax request here.
          alert('It works, and the form is not submitted the traditional way.');
          return false;

Hopefully you can modify my code to make it work for your project. Good luck.
  • 2

#3 Larry



  • Administrators
  • 4921 posts
  • LocationState College, PA (USA)

Posted 16 April 2012 - 8:20 AM

Hey Jack,

Thanks for the nice words on the books. It is appreciated. Not to do a hard sell, but you may want to consider my JavaScript book, which just came out (http://amzn.to/wsdmkq). In it I talk about how to prevent default event behaviors. The approach you use depends upon how the event handler is set up in the first place, as HartleySan suggested.
  • 0

#4 benney



  • Members
  • Pip
  • 4 posts

Posted 28 May 2012 - 10:08 PM

Thanks for this info.
  • 0