ansaurus

Question

How JQuery data validation plugin works on the submit action

Answer 1

A:

If your looking at the examples for JQuery Validate, the following code kills the submit action.

$.validator.setDefaults({
    submitHandler: function() { alert("submitted!"); }
});

ICodeForCoffee 2010-05-18 18:28:07

Answer 2

A:

try following to understand this:

put this in the page

<script type="text/javascript">
$(document).ready(function() { 
 $("#btnSubmit").click(function(){confirm("Are you sure ?");});
});

</script>

you will see that, if you click in cancel, submit action doesn´t happen. This is why when you return false in the button, you cancel the postback, when you return true, the postback happens.

Rbacarin 2010-05-18 18:32:44

Answer 3

+1 A:

What I would do is change the submit button to a button button that way your not confusing the action. After which, you will manually submit the form once it validates. It will look something like this:

<head>
<script type="text/javascript">

  //form validation setup
  var setupFormValidation = function(){

      //bind the click event to the new button with id submit-form
      $("#submit-form").click(function(){
          submitForm();
      });

      //setup validation on commentForm
      $("#commentForm").validate({
          errorLabelContainer: $("div#formerror"),
            rules: {
               name: { required: true }
            },
            messages:{
               name: "please enter your name"       
            }
     });

  }

  //define submitForm function
  //this manually submits form
  var submitForm = function(){
    document.cmxForm.submit();
  } 

  //document loaded 
    $(document).ready(function() {
      //set up your form validation
    setupFormValidation();            
  }); 

</script>

</head>


<!-- add your form error div -->
<div id="formerror"></div>


<!-- added name = cmfForm -->
<form class="cmxform" id="commentForm" method="get" action="" name="cmxForm">
<input id="cname" name="name" size="25" class="required" minlength="2" />

<!-- changed from submit to button with id of submit-form for jquery -->
<input type="button" class="submit" id="submit-form" value="Submit"/>

</form>

croteau 2010-05-18 19:07:16

ansaurus

tags:

views:

answers:

How JQuery data validation plugin works on the submit action

related questions