jquery submit calling function

Question

jquery

function checkname(){
  //check name
}

function checkemail(){
  //check email
}

   function checkgender(){
       $("#gender-result").hide();
          if (undefined == $("input[name='gender']:checked", "#contact-form").val()) {
               $("#gender-result").html('gender requirements.').show();
               $('#gender-result').css('color', 'red');
               return false;          
          }
          return true;
     }

//jquery started
   $(document).ready(function () {
   $("#username").keyup(checkname);
   $("#gender").keyup(checkgender);
   $("#email").keyup(checkemail);
            $('#contact-form').submit(function(){
                checkgender();
                checkname();
                checkemail();
            }
        });

i am new to jquery , why is my submit wont active the function inside?? and if is good way to validation like this?

missing closing parenthesis on the next to last line. change the single line of } to }) and that should get you closer. — ethorn10
– ethorn10, Commented Jun 18, 2015 at 3:44
what is the structure of the those validation methods... does it return true/false — Arun P Johny
– Arun P Johny, Commented Jun 18, 2015 at 3:45

chiliNUT · Accepted Answer · 2015-06-18 03:46:09Z

1

Your code does in fact call the validation functions, but it submits the form immediately after, so you don't know if anything validated. If you do it this way:

$('#contact-form').submit(function () {
    if (!(checkgender() && checkname() && checkemail()){
        //tell the user they screwed up
        return false;
    }
});

When the form is submitted, it runs the validation functions. if they don't all return true, it does not submit the form, at which point you should inform the user they messed up. If the validation is successful, the form is submitted.

For your second question, yes this is a good way to do it, however, after your client side validation, you should always do additional server side validation.

...and also what @ethorn10 said, fix your missing parenthesis.

answered Jun 18, 2015 at 3:46

chiliNUT

19.5k14 gold badges72 silver badges116 bronze badges

Sign up to request clarification or add additional context in comments.

6 Comments

user3233074 Over a year ago

thank you , you spark my day , i was so worry i do wrong on client side validation.

Adarsh Gowda K R Over a year ago

Above code wont trigger your function, form would have been already submitted, Use must use event.preventDefault()

chiliNUT Over a year ago

@AdarshGowdaKR you are incorrect, if the onsubmit function returns false, it prevents the form from being submitted. event.preventDefault() AND return false; are 2 different, valid ways of preventing form submission.api.jquery.com/submit

Adarsh Gowda K R Over a year ago

@chiliNUT, Use must use event.preventDefault(), to prevent the default form.. Before entering your if condition, form values would have been submitted .. So to prevent that use must use event.preventDefault(), and return false is just validation thing , if that condition doesnt satisfied dont submit it.. Please read the article

chiliNUT Over a year ago

@AdarshGowdaKR that is just not true at all. the form is not submitted until after the onsubmit function is executed. if the obsubmit function contains event.preventDefault() or return false; then the form is not submitted, otherwise, the form is submitted. But either way, the entire function will run first before the form is submitted.

|

Adarsh Gowda K R · Accepted Answer · 2015-06-18 03:55:01Z

0

BY default '.submit function' will submit the form, to prevent that we must use event.preventDefault() JSFIDDLE

//jquery started
   $(document).ready(function () {
   $("#username").keyup(checkname);
   $("#gender").keyup(checkgender);
   $("#email").keyup(checkemail);
            $('#contact-form').submit(function(event){
                event.preventDefault(); // preventing the default form submission
                checkgender();
                checkname();
                checkemail();
            })
        });

edited Jun 18, 2015 at 3:55

answered Jun 18, 2015 at 3:43

Adarsh Gowda K R

9618 silver badges15 bronze badges

2 Comments

user3233074 Over a year ago

but the function wont active

Adarsh Gowda K R Over a year ago

Check out this link, jsfiddle.net/bam7zg73 functions get activated upon submission , remaining validation you must write it..

Collectives™ on Stack Overflow

jquery submit calling function

2 Answers 2

6 Comments

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

6 Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related