Introduction
This article is about implementing custom java script validation in Dynamics 365 portal web page. We will discuss how we can show our own custom validation message to portal user.

Requirement
Let’s say we have following web page in portal where portal customer can enter their preferred date for appointment. But in case customer selects Saturday or Sunday, we need to show them our custom validation message.

Solution
Dynamics 365 implement default page validator for the required fields for example if we will try to submit above form without entering preferred date, we will get following validation error

Similarly we can use java script to implement our own custom validation. We can get date selected in preferred date and fetch day from that day. Further we can add our own custom validator to page like below:

$(document).ready(function() {

    //Create appointment date validator
    var appointmentdateValidator = document.createElement('span');

    //setup validator property and associated field
    appointmentdateValidator.style.display = "none";
    appointmentdateValidator.id = "him_appointmentdateValidator";
    appointmentdateValidator.controltovalidate = "him_appointmentdate"; //datetime field
    appointmentdateValidator.evaluationfunction = function() {

        var returnValue = true; //set default value as true

        //get appointment date
        var preferredDate = $("#him_appointmentdate").val();

        //check if date is missing
        if (preferredDate == "")
            returnValue = false; //if appointment date is blank return false

        //format date using moment
        preferredDate = moment(new Date(preferredDate), 'DD/MM/YYYY');

        //get day from date
        var daynumber = new Date(preferredDate).getDay();

        //validation for saturday and sunday
        if (daynumber == 0 || daynumber == 2 || daynumber == 6) {

            //setup custom validation message
            this.errormessage = "<a href='#him_appointmentdate_label'>Preferred Date cannot be selected for Saturday or Sunday, Please select Week Day.</a>";
            returnValue = false;
        }

        return returnValue;

    };
    // Add the validator to the page validators array:
    Page_Validators.push(appointmentdateValidator);

    // Wire up the click event handler of the validation summary link
    $("a[href='#him_appointmentdate_label']").on("click", function() {
        scrollToAndFocus('him_appointmentdate_label', 'him_appointmentdate');
    });

});

We can put above code under Custom JavaScript in entity form. Now if preferred date is missing it will show validation error like below

Stay tuned for more Dynamics 365 Portal Contents !