jquery - preventDefault is not preventing button from calling method in my class file -

I have a button that preforms a search action on my page. I have a simple ZIP code for 5 digits Using jquery to verify If I do not valid zip code then I am using prevention to stop the search. However, the preventDefault method does not seem to work. It still runs the search even if the zip code is not correctly valid.

Here is my jquery code:

  var j $ = jQuery.noConflict (); J $ (document) .ready (function () {var searchButton = j $ ('[id $ = thefilterbutton]') var isValid = true; search button. Click (function (e) {var zip = j $ ('[Id $ = "ZipCodeFilter"] '). Val (); var reg = / ^ [0-9] + $ /; if ((zip.length) & lt; 5 || (zip.length)> 5) {IsValid = false; console.log ("the length of the zip code is not 5");} if (! Reg.test (zip)) {isValid = false; console.log ("zip no digit");} (! IsValid) {console.log ("zip is not valid, stop processing !!!!"); e.stopPropagation (); e.preventDefault (); return false;}}};});  To prevent 

the default method should prevent your call from calling a class file?

This will only prevent the default action that happens if I The event handler is in the highest DOM tree (say a parent form), which handles the submission of the form (and event bubbles on it) preventDefault will not close it.

Its Instead, you want to call stopPropagation (without the preventDefault , depending on the default code)

back flame Class also can be used when using jQuery (which preventDefault is similar to stopPropagation call).

Here is a fiddle which prevention default and stopPropagation :

The first category, if you If you click internal, then two alerts will be thrown (if the internal class was a link - page will not be navigated, but the external event listener is still called ...)

The second category, when If you click on the inner box, it will be alert, but then stop the incident from blubber (thanks to stoppopping For).