Entity Form Custom Validation on Submit Button

The documentation for Dynamics Portals currently only has an example for adding custom validation to the submit button on a form if you are adding that to a step in a Web Form, but what if you want to add validation to the button on an Entity Form? Read on to find out more.

Recently I had a requirement to modify some field values in a portal entity form at the point the submit button is clicked and I had come across the javascript to do this before so I dutifully plodded along to https://docs.microsoft.com to try and find it. The only thing I could find was the code below (Add Custom Javascript):

if (window.jQuery) {

    (function ($) {
        if (typeof (webFormClientValidate) != 'undefined') {
            var originalValidationFunction = webFormClientValidate;
            if (originalValidationFunction && typeof (originalValidationFunction) == "function") {

                webFormClientValidate = function () {
                    originalValidationFunction.apply(this, arguments);
                    // do your custom validation here
                    // return false;
                    // to prevent the form submit you need to return false
                    // end custom validation.

                    return true;
                };
            }
        }
    }(window.jQuery));
}

Having stuck this into the the Custom JavaScript field on the Entity Form and refreshed my page I was then getting errors about the webFormClientValidate being undefined.

Turns out, that on an Entity Form the exact same code works but only if you replace the webFormClientValidate with entityFormClientValidate as below.

if (window.jQuery) {

    (function ($) {
        if (typeof (entityFormClientValidate) !== 'undefined') {
            var originalValidationFunction = entityFormClientValidate;
            if (originalValidationFunction && typeof (originalValidationFunction) === "function") {

                entityFormClientValidate = function () {
                    originalValidationFunction.apply(this, arguments);
                    // do your custom validation here
                    // return false;
                    // to prevent the form submit you need to return false
                    // end custom validation.

                    return true;
                };
            }
        }
    }(window.jQuery));
}

This was a relatively obvious one but I ended up spending much more time on it than I expected so hopefully it saves someone out there some time.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s