0

I've got three forms on one page (checkout, step 1): login form, register form and form for people who doesn't want to create account. I've got a problem with password validation in register form "please make sure your passwords match". I guess it's because it take other password field from login form. I add in validation.js 'validate-cpassword-checkout-register' and I add that class to fields in register form but I don't know what stands for $('confirmation') and $('password') in

`['validate-cpassword', 'Please make sure your passwords match.',function(v) {
                var conf = $('confirmation') ? $('confirmation') : $$('.validate-cpassword')[0];
                var pass = false;
                if ($('password')) {
                    pass = $('password');
                }
                var passwordElements = $$('.validate-password');
                for (var i = 0; i < passwordElements.size(); i++) {
                    var passwordElement = passwordElements[i];
                    if (passwordElement.up('form').id == conf.up('form').id) {
                        pass = passwordElement;
                    }
                }
                if ($$('.validate-admin-password').size()) {
                    pass = $$('.validate-admin-password')[0];
                }
                return (pass.value == conf.value);
            }],`

These are not id's of inputs (id is id="billing:customer_password").

So my question is: How can I validate few forms on one page? Any help appreciated.

[EDIT]

I use login.phtml template to add tabs. For the next two forms I create blocks

login.phtml

<div class="box-checkout-status box-info">
    <div id="checkout-tabs-content" class="tab-content">
        <div id="checkout-login" class="tab-pane active">
            <form id="login-form" action="<?php echo $this->getPostAction() ?>" method="post">
                <div class="fieldset">
                    <?php echo $this->getBlockHtml('formkey'); ?>
                    <ul class="form-list">
                        <li>
                            <label for="login-email" class="required"><em>*</em><?php echo $this->__('Email Address') ?></label>
                            <div class="input-box">
                                <input type="email" spellcheck="false" class="input-text required-entry validate-email" id="login-email" name="login[username]" value="<?php echo $this->escapeHtml($this->getUsername()) ?>" />
                            </div>
                        </li>
                        <li>
                            <label for="login-password" class="required"><em>*</em><?php echo $this->__('Password') ?></label>
                            <div class="input-box">
                                <input type="password" class="input-text validate-password required-entry" id="login-password" name="login[password]" />
                            </div>
                        </li>
                        <?php echo $this->getChildHtml('form.additional.info'); ?>
                    </ul>
                    <input name="context" type="hidden" value="checkout" />
                </div>
            </form>
            <div class="buttons-set">
                <button type="submit" class="btn button-green pull-right" onclick="onepageLogin(this)">
                    <i class="fa fa-lock"></i>
                </button>
            </div>
        </div>

        <div id="checkout-register" class="tab-pane">
            <?php echo $this->getLayout()->createBlock('checkout/onepage_billing')->setTemplate('checkout/onepage/billing.phtml')->toHtml(); ?>
        </div>

        <div id="checkout-guest" class="tab-pane">
            <!-- TODO -->
        </div>
    </div>
</div>

billing.phtml - it's an exactly copied file from base/checkout/onepage/billing.phtml

2
  • can you show your phtml code?
    – ND17
    May 21, 2015 at 8:36
  • I edited my post
    – Wyrobowa
    May 21, 2015 at 9:08

1 Answer 1

1

I found the answer. var con and var pass are the names of inputs so I made new two validators and code looks like this

['validate-password-checkout-register', 'Please enter 6 or more characters. Leading or trailing spaces will be ignored.', function(v) {
    var pass=v.strip(); /*strip leading and trailing spaces*/
    return !(pass.length>0 && pass.length < 6);
}],

And

['validate-cpassword-checkout-register', 'Please make sure your passwords match.', function(v) {
            var conf = $('billing[confirm_password]') ? $('billing[confirm_password]') : $$('.validate-cpassword-checkout-register')[0];
            var pass = false;
            if ($('billing[customer_password]')) {
                pass = $('billing[customer_password]');
            }
            var passwordElements = $$('.validate-password-checkout-register'); //used my validator for password
            for (var i = 0; i < passwordElements.size(); i++) {
                var passwordElement = passwordElements[i];
                if (passwordElement.up('form').id == conf.up('form').id) {
                    pass = passwordElement;
                }
            }
            if ($$('.validate-admin-password').size()) {
                pass = $$('.validate-admin-password')[0];
            }
            return (pass.value == conf.value);
        }],

And I also add class validate-password-checkout-register to password input and validate-cpassword-checkout-register to confirming password input.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.