Question

This is a validation script
This code runs when the user presses the submit button on a form
It loops thru all mandatory fields (entered in an array) and…
1. checks if the element is hidden
2. if not is it empty?
3. if not is it false? (I use false as a value for non selectable options)
And all this sets a variable to true or false.

// when submitting the registration form
function mandatoryCheck() {
    jQuery('.tx-powermail-pi1_formwrap_1723 form.tx_powermail_pi1_form').submit(function(event) {
        var success = false;
        var element;
        jQuery.each(mandatoryFields, function(index, value) {
            element = jQuery('#powermaildiv_uid'+value+' input, #powermaildiv_uid'+value+' select')

            element.each(function() {
                // add class required to all fields
                jQuery(this).addClass('required');

                // is the element hidden, return true
                if(jQuery(this).hasClass('fieldHidden') == true || jQuery(this).is(':disabled')) {
                    success = true;
                } else {
                    // is the input field empty, return false
                    if(jQuery(this).val().length === 0) {
                        success = false;

                    // is the input field not empty, return true
                    } else {
                        // is the input field false, return false
                        if(jQuery(this).val() == 'disabled') {
                            success = false;
                        } else {
                            success = true;
                        }
                    }
                }

                // For each element add/remove validation class
                if(success == false) {
                    jQuery(this).addClass('validation-failed').removeClass('validation-passed');
                } else {
                    jQuery(this).addClass('validation-passed').removeClass('validation-failed');
                }
            });
        });

        // if succes is false, show error message and return false
        if(success == false) {
            jQuery('#c1799').fadeIn().css('display', 'block');
            event.preventDefault();
            return false;
        } else {
            jQuery('#c1799').fadeOut();
        }
    });
}

It works in firefox, chrome ie9 but not ie 7 or 8.
IE7 or 8 adds classes to the elements all random.
It seems like if I validate a select element it passes but an input field fails

What can be wrong?

Edit:
Here is the page: http://asdf.patrikelfstrom.se/index.php?id=267
Enter 1234 if in the little form that shows up
JS: http://asdf.patrikelfstrom.se/typo3conf/ext/gc_fm/res/js/ShowAndHideFields.js

If you press submit (absenden) the field Türnummer should be green (as it is in chrome, firefox etc.) but in ie7/8 it is red.

If you click on Wähle… (The select box) and choose Wohnung the fields under it becomes enabled and if you press submit now Türnummershould be red since the element is visible and empty.
This seems to work but if you click on the select box again and choose einfamilienhaus.
The fields are disabled and should now be green when submitting but this is not the case in IE7/8.

Answer 1

I think you need to loop through element, as it will be a collection of objects, so you would do…

// is the element hidden, return true
element.each(function() {
   if($(this).hasClass('fieldHidden') == true) {
   ...

})

Well, just to show the point, depends on your code what you need to actually change