Custom JavaScript validation for Microsoft Portal Web Form

(0) Share

Report

Posted on by Dynamotion

Hi,

I've been trying to add a custom JavaScript validation for one of my Portal Web Forms and I can't seem to get it to work.

I've tried both Additional Field Validation and General Client Side Validation from what's provided here but it just doesn't work : https://docs.microsoft.com/en-us/dynamics365/customer-engagement/portals/add-custom-javascript

Here's what I did for the General Client Side Validation:

if (window.jQuery) {

    (function ($) {

        $(document).ready(function () {
            alert("In here 1");
            if (typeof webFormClientValidate === "function") {
                alert("In here 2");
                var originalValidationFunction = webFormClientValidate;
                if (originalValidationFunction && typeof originalValidationFunction === "function") {
                    alert("In here 3");
                    webFormClientValidate = function () {
                        originalValidationFunction.apply(this, arguments);
                        alert("In here 4");
                        var _allowSubmit = false;

                        var _selected = $("#WebResource_MyCustomPage").contents().find("input[type='checkbox']:checked");

                        if (_selected != null && _selected != undefined && _selected != "" && _selected.length > 0) {
                            alert("In here 5.1");
                            _allowSubmit = true;
                        }
                        else {
                            alert("In here 5.2");                            
                            _allowSubmit = false;
                        }

                        return _allowSubmit;
                    };
                }
            }

        });
    }(window.jQuery));
}

I just get the alert "In Here 1" when the web form step loads, but that's it. And yes I have Enable Validation Summary Links checked.

Does the latest version of the Portal have anything to do with it (considering Microsoft "fixes" stuff that's not broken from time to time)? The only workaround I can think of right now is to use a custom button using DOM injection and hide the default Next button.

Any help would be appreciated.

*This post is locked for comments

I have the same question (0)

All responses (4)

Answers (0)

Suggested answer

Ben Thompson 6,350 on at

Like (0)

Report

You really need to add a debugger; statement after alert("In here 1"); and run the Javascript in Developer Tools to see what the rest of the code looks like.

Without debugging anything and looking at your code surely the next line should be if (typeof (webFormClientValidate) - note the additional brackets...

Was this reply helpful? Yes No
Dynamotion on at

Like (0)

Report

I did try the original code that was provided in the links with the brackets, etc. but that didn't work. So I went on to inspect to see the actual code that's wired to the "onclick" of the Submit button and the code was slightly different. So I modified it according to that. I've tried various combinations but never got it to work.

I would have tried debugger but that wouldn't take me to the line in the code (for some reason) which is why I used alerts so at least I could decipher the flow.

Was this reply helpful? Yes No
Ben Thompson 6,350 on at

Like (0)

Report

Personally you don't need to be at the line of code - what you want to be in is in the position to see the value of webFormClientValidate and typeof (webFormClientValidate) from either the javascript console or variable watching as I suspect the value of typeof (webFormClientValidate) is not "function"

Was this reply helpful? Yes No
Suggested answer

RaviKashyap 55,410 Moderator on at

Like (0)

Report

Hi,

I am currently on portal version 9.0.10.16 and can confirm that this method works. I am using it in my current portals. Refer below. I would suggest to use the below sample and return false by default to to check if this restrict you to go next/ submit. If this works then you can add you custom logic.

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.

$("#new_fulladdress").prop('disabled', false);

$("#new_fulladdress_mailing").prop('disabled', false);

return true;

};

}

}

}(window.jQuery));

}

Hope this helps.

Was this reply helpful? Yes No