Magento – VarienForm not working in magento 1.9.2 community edition

ce-1.9.2.2magento-1.9magento-1.9.2.1PHPvarien

Hello I am developing a login and register form in magento. For form validation I am using this code

var registerForm = new VarienForm('register-form', true);

var loginForm = new VarienForm('login-form', true);

if (this.validator && this.validator.validate()) {
    this.form.submit();
}

when i am using this code in phtml with script tag it is working but when I am putting it in js and calling through xml it is not working here is my xml code

<custom_abc_index>

    <reference name="root">
        <action method="setTemplate">
            <template>page/1column.phtml</template>
        </action>
    </reference>

   <reference name="head">
        <action method="addItem">
            <type>skin_js</type>
            <name>js/custom_abc/customLoginRegister.js</name>
        </action>
    </reference>

    <reference name="content">
        <block type="custom_abc/custom" name="custom" template="custom_abc/Custom.phtml"></block>
    </reference>


</custom_abc_index>

To check whether js is loading or not i put alert() in it , I got the popup but I don't know why the validation code is not working. Any Help will be appreciable.

Best Answer

You do not write validation properly.

If your form button type is submit(<button type="submit"), then you don't have to use the code above.

if (this.validator && this.validator.validate()) {
    this.form.submit();
}

Because VarienForm onsubmit call magento validate check

if form's button type is button(<button type="button") then you need (this.validator && this.validator.validate()) { ...

first,you need to add a on click function onclick="registerForm.submit(this)".

Then you need to define function of this varien form

var registerForm = new VarienForm('register-form', true);

var loginForm = new VarienForm('login-form', true);


    registerForm.submit = function(button, url) {
        if (this.validator.validate()) {
            var form = this.form;
            var oldUrl = form.action;

            if (url) {
               form.action = url;
            }
            var e = null;
            try {
                this.form.submit();
            } catch (e) {
            }
            this.form.action = oldUrl;
            if (e) {
                throw e;
            }

            if (button && button != 'undefined') {
                button.disabled = true;
            }
        }
    }.bind(registerForm);

    loginForm.submit = function(button, url) {
        if (this.validator.validate()) {
            var form = this.form;
            var oldUrl = form.action;

            if (url) {
               form.action = url;
            }
            var e = null;
            try {
                this.form.submit();
            } catch (e) {
            }
            this.form.action = oldUrl;
            if (e) {
                throw e;
            }

            if (button && button != 'undefined') {
                button.disabled = true;
            }
        }
    }.bind(loginForm);