1
js/prototype/validation.js

I have two classes: validate-email, validate-mobilePhoneNumber

customer/form/login.phtml

In email input, the customer can log with the email address or a phone number, so what I would like to do is that when the user enters an email address, I validate the email class: validate-email and if he enters a phone number I validate it the phone class: validate-mobilePhoneNumber

<li>
    <label for="email" class="required"><em>*</em><?php echo $this->__('Email address or phone number')  ?></label>
    <div class="input-box">
         <input type="text" name="login[username]" value="<?php echo $this->escapeHtml($this->getUsername()) ?>" id="email" class="input-text required-entry " title="<?php echo $this->__('Email address or phone number') ?>" />
    </div>
</li>

EDIT: On the basis of the answer of Jaimin Sutariya

In js/prototype/validation.js we need to add a custom validation

Validation.add('validate-email-or-phone', 'Please enter a valid Email address or phone number.', function(v) {
return Validation.get('IsEmpty').test(v) || Validation.get('validate-email').test(v) || Validation.get('validate-mobilePhoneNumber').test(v)

})

1 Answer 1

2

You can achieve this by adding a custom validation to your form field. Add below validation script to your phtml file.

<script type="text/javascript">
//<![CDATA[
    Validation.add('validate-email-or-phone', 'Please enter a valid Email address or phone number.', function(v) {
        return Validation.get('IsEmpty').test(v) || Validation.get('validate-email').test(v) || /^(\+\d{1,3}[- ]?)?\d{10}$/.test(v)
    });
    Translator.add("Please enter a valid Email address or phone number.","<?php echo $this->__("Please enter a valid Email address or phone number."); ?>");
//]]>
</script>

You need to replace validate-email class with validate-email-or-phone in your textbox. This validation will check for email address and for mobile number it will accept all numbers included in this question.

You need to add CSV file for translation.

8
  • Yes, great @Jaimin, just i customized it else look my update. another question: you know how to put a translate function in a validation error Please enter a valid Email address or phone number.
    – PЯINCƎ
    Mar 15, 2017 at 9:52
  • Double "and" in your answer. Small typo. :)
    – Max
    Mar 15, 2017 at 9:59
  • Thanks. Updated answer please check, I think you know how to add translation using CSV file. Mar 15, 2017 at 10:11
  • I want to declare two id for the same input field how to declare?
    – zus
    May 22, 2020 at 6:09
  • 1
    @zus, You can use Validator.add function the second time and add the validation class in your input just like we add multiple classes on an html element. May 23, 2020 at 2:18

Your Answer

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

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