Skip to main content
Commonmark migration
Source Link

#Solution

Solution

#Why does it so ?

Why does it so ?

#Solution

#Why does it so ?

Solution

Why does it so ?

Source Link
Rajeev K Tomy
  • 17.3k
  • 6
  • 63
  • 103

#Solution

<script type="text/javascript">
//<![CDATA[

    var contactForm = new VarienForm('contactForm', true);

    jQuery('#contactForm').submit(function(){
        console.log('submitted');
        jQuery(document).foundation('equalizer', 'reflow');
    });

//]]>
</script>

Difference here is, you are now listening to the event submit() instead of click(). Due to this your jquery function will be triggered after validations are carried out by VarienForm.

#Why does it so ?

See VarienForm declaration in js/varien/form.js.

VarienForm = Class.create();
VarienForm.prototype = {
    initialize: function(formId, firstFieldFocus){
        this.form       = $(formId);
        if (!this.form) {
            return;
        }
        this.cache      = $A();
        this.currLoader = false;
        this.currDataIndex = false;
        this.validator  = new Validation(this.form);
        this.elementFocus   = this.elementOnFocus.bindAsEventListener(this);
        this.elementBlur    = this.elementOnBlur.bindAsEventListener(this);
        this.childLoader    = this.onChangeChildLoad.bindAsEventListener(this);
        this.highlightClass = 'highlight';
        this.extraChildParams = '';
        this.firstFieldFocus= firstFieldFocus || false;
        this.bindElements();
        if(this.firstFieldFocus){
            try{
                Form.Element.focus(Form.findFirstElement(this.form))
            }
            catch(e){}
        }
    },

    submit : function(url){
        if(this.validator && this.validator.validate()){
             this.form.submit();
        }
        return false;
    },
    ...
} 

You can see above that Validator is called inside the function submit. This means VarienForm validation is bind to the event submit.

In your case, you are using click() event on button, which will be fired before submit() event on form. This is why it is not working in your scenario.

In my solution, we are using form submit event and which is loaded after varien form call. Due to this, jquery submit call will be fired only after VarienFrom has done.