Episerver forms - Email confirmation

Would like two email boxes

  1. Email
  2. Confirm Email

How can I go about adding validation for box 2 like other typical email/confirm email validations?

#181182 Aug 10, 2017 21:11
  • What I can suggest you that you create an custom element called ConfirmEmail and a custom validator for validate that field. Then in the validate method of the validator, you will check if 2 email field are equal or not. You could look into sameple here: https://github.com/episerver/EPiServer.Forms.Samples to know how to create custom element and custom validator.

    Hope this help.

    #181189 Aug 11, 2017 6:38
  • Hi Dac

    How would I get the value of the original email box?

    #181202 Aug 13, 2017 2:13
  • Because you want cross field validation, you need to mark your orginal email field with a class, id, attribute. Then in the validate method of second field, query it out then do the validation. You also can override the method GetAttributes() of an element to return custom attributes which you may need for your query.

    #181272 Aug 15, 2017 11:06
  • Sorry,

    I'm new to episerver forms.  Why do I need to mark my original email field with class, id, attribute.  Don't you already mark the id by some guid value?  Also, when you say query it out, are you saying I need to find it via jquery selector/client side?  This seems to be a lot of work for a simple confim email.  I would love to just do client side validation on this.  Forms is slow enough as it is without adding additional server side validation which can be done client side.

    What do you feel is the best way to add javascript validation to this.  I feel I can use jquery to get the value of the original email box/confirm email but how do I go about putting a validation message under the confirm email box consistent with other validation messages?

    #181285 Aug 15, 2017 19:00
  • Yes, I mean using jquery to find your element. The validator itself only validate for element which it associated with. So cross field validation need extra effort. You can see in the sample project (EPiServerFormsSample.js) you just return valiation result with message, it will be put on your element automatically.

    "EPiServer.Forms.Samples.Implementation.Validation.RecaptchaValidator": function (fieldName, fieldValue, validatorMetaData) {
        // validate recaptcha element
        if (fieldValue) {
            return { isValid: true };
        }
    
        return { isValid: false, message: validatorMetaData.model.message };
    }

    #181322 Aug 16, 2017 12:38