Microsoft Portal JavaScript

We have been working on Microsoft Dynamics Portals for sometime now and we come across scenarios where we need to show/hide fields, make fields required and so on..

 Today we will see how we can use Javascript to perform these basic functions.

Place all your code in Jquery Document ready function

$(document).ready(function () {  //your functions
});

Disable lookup field

 if ($("#" + fieldName + "_name").hasClass("lookup")) {
  disableLookup(fieldName, fieldName + "_entityname");
 }

 function disableLookup(LookupNameID, LookupEntityNameID) {
  var L_EN_ID = '#' + LookupEntityNameID;
  var L_N_ID = '#' + LookupNameID;
  var buttonContainer = $(L_EN_ID).next()[0];

  if (buttonContainer != null && buttonContainer.children != null) {
   for (var i = 0; i < buttonContainer.children.length; i++) {
    var tagName = buttonContainer.children[i].tagName.toLowerCase();
    if (tagName == "button")
     buttonContainer.children[i].classList.add("hidden");
   }
  }
  $(L_N_ID + "_name").attr("readonly", true);
  $(L_N_ID).attr("style", "width: 100%");
  $(L_N_ID + "_name").addClass("readonly");
  $(L_N_ID + "_name").addClass("disabled");

  $(L_N_ID).parent()[0].setAttribute("style", "width: 100%");
 }

Disable DateTime field

 if ($("#" + fieldName).hasClass("datetime")) {
  $("#" + fieldName)
  var dateTimeInput = $("#" + fieldName)[0].nextElementSibling;

  for (var i = 0; i < dateTimeInput.children.length; i++) {
   var tagName = dateTimeInput.children[i].tagName.toLowerCase();
   if (tagName == "input") {
    dateTimeInput.children[i].classList.add("readonly");
    dateTimeInput.children[i].classList.add("disabled");
   } else if (tagName == "span") {
    dateTimeInput.children[i].classList.add("hidden");
   }
  }
  $("#" + fieldName).addClass("readonly");
  $("#" + fieldName).addClass("disabled");
 }

Disable Money Field

 if ($("#" + fieldName).hasClass("money")) {
  $("#" + fieldName).prop("disabled", "disabled");
  $("#" + fieldName).addClass("readonly");
  $("#" + fieldName).addClass("disabled");
  var parentTemp = $("#" + fieldName)[0].previousElementSibling;

  if (parentTemp != null && parentTemp.classList != null) {
   parentTemp.classList.add("hidden");
  }
 }

Displaying a dash(-) in field value

 
 function displayDash(fieldName) {
  if ($("#" + fieldName).val() == "") {
   $("#" + fieldName)[0].parentElement.setAttribute("style", "position: relative;");
   var blanktab = $("#" + fieldName)[0].nextElementSibling;

   if (blanktab == null) {
    blanktab = document.createElement("div");
    blanktab.classList.add("text-muted");
    blanktab.setAttribute("aria-hidden", "true");
    blanktab.setAttribute("style", "position: absolute; top: 4px;");
    blanktab.innerText = "—";
    $("#" + fieldName)[0].parentElement.appendChild(blanktab);
   }
  }
 }

Show Field

 function show(fieldName) {
  if ($("#" + fieldName) != null) {
   $("#" + fieldName + "_label").show();
   $("#" + fieldName).show();
   $("#" + fieldName).closest("td").show();
  }
 }

Hide Field

 function hide(fieldName) {
  if ($("#" + fieldName) != null) {

   $("#" + fieldName + "_label").hide();
   $("#" + fieldName).hide();
   $("#" + fieldName).closest("td").hide();
  }
 }

Set Field Values

 function SetFieldValue(fieldName) {
  var isCheckBox = $('#').is(': checkbox ');

  if (isCheckBox === true && formIsOnLoad == false)
   document.getElementById(fieldName).checked = false;
  else if (formIsOnLoad == false)
   $("#" + fieldName).val(null);
 }

Set Required Field

 function MarkFieldsRequired(fieldName) {
  if (typeof (Page_Validators) != 'undefined') {

   var discoverdByValidator = document.createElement('span');

   discoverdByValidator.style.display = "none";
   discoverdByValidator.id = " ";
   discoverdByValidator.controltovalidate = fieldName;
   discoverdByValidator.errormessage = "Invoice Number is a required field.";
   discoverdByValidator.validationGroup = ""; // Set this if you have set ValidationGroup on the form
   discoverdByValidator.initialvalue = "";
   discoverdByValidator.evaluationfunction = function () {
    var value = $("#" + fieldName).val();
    if (value == null || value == "") {
     return false;

    } else {

     return true;
    }

   };

   Page_Validators.push(discoverdByValidator);

   // Wire up the click event handler of the validation summary link
   $("a[href='#" + fieldName + "_label']").on("click", function () {
    scrollToAndFocus(fieldName + "_label", fieldName);
   });
   $("#" + fieldName + "_label").parent().addClass("required");
   $(“#" + fieldName +"
    _label”).after('  *')

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

     webFormClientValidate = function () {
      originalValidationFunction.apply(this, arguments);
      var value = $("#" + fieldName).val();
      if (value == null || value == "") {
       return false;
      } else {
       return true;
      }

     };
    }
   }
  }
 }