web
You’re offline. This is a read only version of the page.
close
Skip to main content

Notifications

Announcements

Community site session details

Community site session details

Session Id :
Power Platform Community / Forums / Power Pages / Validate fields based ...
Power Pages
Unanswered

Validate fields based on other fields

(1) ShareShare
ReportReport
Posted on by 36

Hello. I currently have a form where the user must select an option from a dropdown list. Depending on what choice the user selects, certain fields must be changed to required/not required and some fields must hide/show.

 

dropdown- field1 (choice1, choice2)

required field- field2

hidden field- field3

 

I found this code in another similar question and have read the documentation by Microsoft with similar code to this. My issue is I'm pretty new to code and am getting confused by which things to change, which labels go where, etc. 

setRequired = function (fieldName) {
 var $label = $("#" + fieldName + "_label");
 $label.parent().addClass("required");
 addValidator(fieldName, $label.text());
};

setOptional = function (fieldName) {
 var $label = $("#" + fieldName + "_label");
 $label.parent().removeClass("required");
 removeValidator("RequiredFieldValidator" + fieldName);
};

addValidator = function (fieldName, label) {
 var nV = document.createElement("span");
 var message = "<span class='font-weight-bold'>" + (typeof label === "string" ? label : fieldName) + "</span> is a required field.";
 nV.style.display = "none";
 nV.validationGroup = "";
 nV.initialvalue = "";
 nV.id = "RequiredFieldValidator" + fieldName;
 nV.controltovalidate = "#" + fieldName;
 nV.errormessage = "<a href=\'#" + fieldName +
 "_label\' onclick=\'javascript&colon;scrollToAndFocus(\"" + fieldName + "_label\",\"" +
 fieldName + "\");return false;\'>" + message + "</a>";
 var $field = $("#" + fieldName);
 nV.evaluationfunction = function () {
 var value = $field.val();
 return typeof value === "string" && value !== "";
 };
 var $validator = $field.closest("td").find("div.validators");
 if ($validator.length === 0) {
 var $info = $field.closest("td").find("div.info");
 $validator = $("<div class='validators'></div>").appendTo($info);
 }
 $validator.append(nV);
 window.Page_Validators.push(nV);
};

removeValidator = function (validatorId) {
 $.each(window.Page_Validators, function (index, validator) {
 if (validator !== null && validator !== undefined &&
 validator.id === validatorId) {
 window.Page_Validators.splice(index, 1);
 }
 });
};

 

How do I properly state if this choice and this choice are selected, then set this field as required?

Also is there a way to have the field grey out (still be visible but not editable), instead of hiding it completely?

Any help at all would be really appreciated.

Categories:
I have the same question (0)
  • oliver.rodrigues Profile Picture
    9,368 Most Valuable Professional on at

    Nicholas Hayduk has recently posted a video on JavaScript validation, he is also doing a JS on Power Pages call today, hopefully you can attend (if not this will be available on Youtube in about two days)

    Engineered Code - Portals Community Call

    Power Pages Tip #186 - Adding Custom Validators to Forms - Engineered Code - YouTube

     

  • e.lll Profile Picture
    36 on at

    Thanks I'll look into these!

Under review

Thank you for your reply! To ensure a great experience for everyone, your content is awaiting approval by our Community Managers. Please check back later.

Helpful resources

Quick Links

Forum hierarchy changes are complete!

In our never-ending quest to improve we are simplifying the forum hierarchy…

Ajay Kumar Gannamaneni – Community Spotlight

We are honored to recognize Ajay Kumar Gannamaneni as our Community Spotlight for December…

Leaderboard > Power Pages

#1
Jerry-IN Profile Picture

Jerry-IN 71

#2
Fubar Profile Picture

Fubar 62 Super User 2025 Season 2

#3
sannavajjala87 Profile Picture

sannavajjala87 31

Last 30 days Overall leaderboard