JQuery event.preventDefault () not working in Firefox (JSFiddle enabled)

Question

This is a kind of similar duplicate for some others here, but I think in this case I am using event.preventDefault() correctly.

Here JSFiddle you can see the code with: http://jsfiddle.net/SeEw2/2/

Basically, click the "Submit" button.

In Chrome: Nothing happens - the correct answer.

In Firefox : reloading the page, oh noes!

So why a page reload in Firefox and not in Chrome? I was Firebugging and no errors occurred in ...

Answer 1

The event variable in your code is not initialized.

http://jsfiddle.net/SeEw2/4/

extract:

  $('#ajaxsearch').click(function(event) { // Stop the Search input reloading the page by preventing its default action event.preventDefault(); 

Answer 2

And I had a similar problem in the past. Instead of event.preventDefault (), try passing an event:

  function ie8SafePreventEvent(e){ if(e.preventDefault){ e.preventDefault()} else{e.stop()}; e.returnValue = false; e.stopPropagation(); } 

I know that he says IE, but I never had a problem with it, since =]

Answer 3

Since you are not passing an event object, for example function(event) , but my question is, why even go through all this when you can type="button" and onclick pass the values? Essentially what you do with this whole process.

Answer 4

Instead of looking for the click event on the submit button, why not use the $ (form) .submit handler?

As long as you have "return false" at the end of the handler, the page does not reload.

Answer 5

I decided it this way because my code is a little different, it may be useful for other people. My original code was as follows.

 <form id="enrollstudentform" onsubmit="return enrollStudents()"> ... </form> 

My js function looked like

 function enrollStudents() { // Stop Form. event.preventDefault(); // Other code } 

I had to pass a parameter event in a function call and get it in a function .

 <form id="enrollstudentform" onsubmit="return enrollStudents(event)"> ... </form> 

js code:

 function enrollStudents(event) { // Stop Form. event.preventDefault(); // Other code } 

Hope this helps.