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: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.