CODEWITHSUNDEEP
jqueryhtmlforms
Dimt
Dimt

Reputation: 2328

How to stop form from submission in an event handler?

I have a dynamic form which gets submitted via dynamically generated links. I've also bound submit() event handler to validate if all the selects are selected. How to stop form submission in the following event handler?

HTML link:

<a href="javascript:void(0);" onclick="$(this).closest('form').submit();">Get</a>

Event Handler:

$('form').submit(function(e){   
   var $target = e.target;
   $($target).find('select').each(function(index, elem){
      if($(elem).val() === ''){
      return false; // this doesn't stop the form submission
      }
   });      
});

Upvotes: 0

Views: 261

Answers (3)

Ranjith Kumar Nagiri
Ranjith Kumar Nagiri

Reputation: 863

try this, replace this line

if($(elem).val() == '' || $(elem).val() == null )

Upvotes: 0

Sean
Sean

Reputation: 2416

When you submit a form using jQuery, that argument that is passed through to your function is called an event object:

$('form').submit(function(e){

In this case, e is that object.

This event object can be used to prevent the standard (default) operation from occurring based on what event has just occured. To do that, you may call:

e.preventDefault();

In addition,

$($target).find('select').each(function(index, elem){
   if($(elem).val() === ''){
   return false; // this doesn't stop the form submission
   }
});

Your return statement in this code block will not affect the form's event at all because it is breaking out of your .each() anonymous function for a single iteration.

Upvotes: 1

Java_User
Java_User

Reputation: 1321

Please Try e.preventDefault()?

Upvotes: 1

Related Questions