tags:

views:

13

answers:

1

Im at a loss here, I have 2 forms that have to share one submit button. I am able to tell which form submits by checking values of input's, but I can't get the validation to bind itself to the form on submit. I need to add validation and ajax functionality (remove forms and display another div-but that should be easy once I get the validation running. I am familiar and can do it successfully on ready or on click, but this is the first time Ive had to bind it to a submit function..below is my non working code. please help!

$("#sbtBtn").click(function() {
          if($("input[name=license_code]").val()) {      //check if #retUser has a value
            $("#formOne").submit();
          } else if ($("input[name=referred_by_text]").val() && $("input[name=broker_text]").val() && $("input[name=email1]").val()) {
            $("#formTwo").submit();
          }
            else {
             alert("Please fill out either the returning user or new user form");   
            }

    });

    $("#formOne").submit(function() {
        //if (valid) $(this).submit();
        var validator = $("#formOne").validate({
            errorElement: "em",
            //errorContainer: $("#summary"),
            errorPlacement: function(error, element) {
                error.appendTo( element.parent("li"));
            },

            submitHandler: function(form) {
            var dataString = $(form).serialize();
                $.ajax({
                    type: $(form).attr('method'),
                    url: form.action,
                    data: dataString,
                    success: function(data, status) {
                         $("#currentUser, #newUser, #submitContain").hide();
                    },
                    error: function (data, status) {
                        $("#newUser, #submitContain").hide();
                        $("#currentUser").html("error");
                    }
                });
            return false;
           },
            rules: {
                    license_code: {
                    minlength: 2
                }
            },

            messages: {
                license_code: {
                    minlength: "Your Code Must be at Least 2 Characters"
                }
            }
        });
    });

    $("#formTwo").submit(function() {
        alert("formTwo");
        return false;
    });

formTwo has the alert in there I was using to make sure it was binding the right form to the submit, which it is.

A: 

on the

 $("#formOne").submit(function() {

return true;

will allow the form to submit if valid data, return false will stop it.

Liam Bailey
@Liam - I can't seem to get it to display an error message or to add the class "error" to the node
Dirty Bird Design
From what I can see, error element tells the plugin what element to display the error messages inside, and errorPlacement to set where you want error messages displayed. You have em in error element, and li in errorPlacement, cancelling each other out maybe. Try deleting the errorElement line
Liam Bailey