0

Hi all!

I'm trying to validate this form:

<form action="<?php $_SERVER['PHP_SELF'] ?>" class="horizontal-form" name="settings" id="settings" method="post">
    <div class="row-fluid">
        <div class="span4 ">
            <div class="control-group">
                <label class="control-label" for="firstName">First Name</label>
                <div class="controls">
                    <input type="text" id="fn" class="m-wrap span12" value="<?php echo $userInfo['fn']; ?>">
                </div>
            </div>
        </div>
    </div>
</form>

I've added my validation js files.. These are the main vaildation files:

  • <script src="assets/plugins/jquery-validation/dist/jquery.validate.min.js" type="text/javascript"></script>
  • <script type="text/javascript" src="assets/plugins/jquery-validation/dist/additional-methods.min.js"></script>

This one validates this particular form:

  • <script src="assets/scripts/settings.js" type="text/javascript"></script>

In this file settings.js I have this (Just a snippet):

var validateSettings = function () {

    return {
        //main function to initiate the module
        init: function () {

            var settingsForm = $('#settings');

            settingsForm.validate({
                errorElement: 'label', //default input error message container
                errorClass: 'help-inline', // default input error message class
                focusInvalid: false, // do not focus the last invalid input
                ignore: "",
                rules: {
                    fn: {
                        required: true,
                        lettersonly: true,
                        minlength: 2
                    }

    },

            messages: {
                fn: {
                    required: "Please enter your first name.",
                    minlength: "Minimum of 2 characters."
                } 
            },

            invalidHandler: function (event, validator) {   

            },

            highlight: function (element) { // hightlight error inputs
                $(element)
                    .closest('.control-group').addClass('error'); // set error class to the control group
            },

            success: function (label) {
                label.closest('.control-group').removeClass('error');
                label.remove();
            }
        });
    }
        /*IGNORE ALL OF THESE BRACKETS, I CUT A LOT OF THE FILE OUT*/
};

}();

At the end of the page containing the form I execute the vaidation using:

    <script>
        jQuery(document).ready(function() {    
           validateSettings.init();
        });
    </script>

The form is much larger but I've seletced one field from each file to debug.

Why is this validation kicking me in the teeth?? It works everywhere else on the site. Thanks for any help!

Edited by mmcdonald

2
Contributors
1
Reply
24
Views
4 Years
Discussion Span
Last Post by LastMitch
0

The form is much larger but I've seletced one field from each file to debug.

What do you mean by larger? You mean the input tags? Can you explained a little more in detail of what is the issue?

This topic has been dead for over six months. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.