[Code Snippet] Dynamics Portals/ADX – Set ‘Field Requirement’ using script
Below is the code snippet to set the requirement level (i.e., Required/Non-Required) of a field using script in portals. This logic handles all kind of field types including Check boxes.
Set Field As Required:
function SetFieldAsRequired(fieldName) {
if (typeof (Page_Validators) == ‘undefined’) return;
if ($(“#” + fieldName) != undefined && $(“#” + fieldName + “_label”) != undefined) {
$(“#” + fieldName).prop(‘required’, true);
$(“#” + fieldName).closest(“.control”).prev().addClass(“required”);// Create new validator object
var Requiredvalidator = document.createElement(‘span’);
Requiredvalidator.style.display = “none”;
Requiredvalidator.id = fieldName + “Validator”;
Requiredvalidator.controltovalidate = fieldName;
Requiredvalidator.errormessage = “<a href=’#” + fieldName + “_label’>” + $(“#” + fieldName + “_label”).html() + ” is a required field.</a>”;
Requiredvalidator.initialvalue = “”;
Requiredvalidator.evaluationfunction = function () {
var fieldControl = $(“#” + fieldName);
if (fieldControl.is(“span”)) {
var value0 = $(“#” + fieldName + “_0”).prop(“checked”);
var value1 = $(“#” + fieldName + “_1”).prop(“checked”);
if (value0 == false && value1 == false) {
return false;
} else {
return true;
}
}
else {
var value = $(“#” + fieldName).val();
if (value == null || value == “”) {
return false;
} else {
return true;
}
}
};// Add the new validator to the page validators array
Page_Validators.push(Requiredvalidator);
}
}
Set Field As Non Required:
function SetFieldAsNonRequired(fieldName) {
if (typeof (Page_Validators) == ‘undefined’) return;
if ($(“#” + fieldName) != undefined) {
$(“#” + fieldName).closest(“.control”).prev().removeClass(“required”);
$(“#” + fieldName).prop(‘required’, false);for (i = 0; i < Page_Validators.length; i++) {
if (Page_Validators[i].id == fieldName + “Validator”) {
// Remove the current field’s ‘Required’ validator from ‘Page_Validators’ array
Page_Validators.splice(i);
}
}
}
}
How to use the functions:
- Above functions can be called from ‘Custom JavaScript’ tab of Portal’s ‘Entity Form’.
- Pass the Dynamics field’s schema name as the parameter to both functions.
- In below example, ’emailaddress1′ is the field name which I want to set the Requirement level.
Refer the article for Portal script syntax’s and usage.
🙂
Dynamics Portals – Customize OOB ‘Entity List’ grid
I was working on a Portal requirement where I had to customize the ‘Entity List’ grid by adding ‘Check Box’ control in the first column and a ‘Submit’ button, which has the custom logic.
Below is how the OOB ‘Entity List’ grid looks like
OOB ‘Entity List’ grid
Now, lets see how to customize the OOB ‘Entity List’ grid by adding additional controls (i.e., Check box and Button).
Below are the list of portal components in the order, to achieve this requirement.
- Create a new ‘Entity List’
- Create a new ‘Web Template’
- In the ‘Source’, we will have logic to loop through the ‘Entity List’ records (i.e.,Rows) and add ‘Check Box’ control in the 1st column.
- In the below image, {% entitylist id:page.adx_entitylist.id %} refers the ‘Entity List’ loaded on the current page.
- Create a new ‘Page Template’ and map the newly created ‘Web Template’
- Create a “Web Page’ and map the ‘Entity List’ and ‘Page Template’
- That’s it. Go to Portal, clear cache and hit the ‘Web Page’ URL. You should see grid with ‘Check Box’ as first column.
Customized Grid
Web Template’s ‘Source’ :
<body>
{% entitylist id:page.adx_entitylist.id %}
{% entityview id:params.view, search:params.search, order:params.order, page:params.page, pagesize:params.pagesize, metafilter:params.mf %}
<table id=”tblContacts” class=”table table-striped”>
<thead>
<tr class=”row”>
<th class=”col-sm-1″>
</th>
{% for c in entityview.columns -%}
<th width=”{{ c.width }}” data-logicalname=”{{ c.logical_name }}”>
{{ c.name }}
</th>
{% endfor -%}
<th width=”1″></th>
</tr>
</thead>
<tbody>
{% assign i = 0 %}
{% for e in entityview.records %}
<tr class=”row”>
<td class=”col-sm-1″>
<input type=”checkbox” id=”chk{{i}}” onclick=”” />
</td>
{% for c in entityview.columns %}
{% assign attr = e[c.logical_name] %}
{% assign attr_type = c.attribute_type | downcase %}
<td data-logicalname=”{{ c.logical_name }}”>
{% if attr.is_entity_reference %}
{{ attr.name }}
{% elsif attr_type == ‘datetime’ %}
{% if attr %}
<time datetime=”{{ attr | date_to_iso8601 }}”>
{{ attr }}
</time>
{% endif %}
{% elsif attr_type == ‘picklist’ %}
{{ attr.label }}
{% else %}
{{ attr }}
{% endif %}
</td>
{% endfor %}
<tr>
{% assign i = i | plus:1 %}
{% endfor %}
</tbody>
</table>
{% endentityview %}
{% endentitylist %}
</div>
</div></div>
</body>
🙂
ADX\Dynamics Portals – Using sub grids in Entity Form
In this article, lets see how to work with ‘Sub grids’ on ‘Entity Forms’ in Portals.
Lets take a scenario to understand this better, In Dynamics:
- Create a new custom Entity named ‘Employee’
- Create a related entity ‘Child’ to capture children details of ‘Employee’
- Configure a single portal screen, to capture ‘Employee’ and ‘Children’
Below is how the ‘Employee’ entity form with ‘Children’ sub grid, in Dynamics, looks like:
High level design steps:
- Create a new ‘Entity Form’ for ‘Employee’ Dynamics form
- Create a new ‘Entity Form’ (i.e.,Child Create) for ‘Child’ entity to ‘Insert’ (i.e., Mode=Insert) record
- Create a new ‘Entity Form’ (i.e., Child Details) for ‘Child’ entity to ‘Edit’ (i.e., Mode=Edit) record
- On ‘Employee’ entity form, configure ‘Child’ ‘Sub grid’ using ‘Entity Form Metadata’
- Add ‘Create’ and ‘Details’ actions on Sub grid.
Now lets see step by step.
Create new ‘Entity Form’ Employee:
- Create a new ‘Employee Details’ Entity Form pointing to ‘Employee’ entity and ‘Information’ form.
- Now lets see how the ‘Employee’ form looks in the portal.
- If you notice, there is a grid section ‘Children’ available on Portal form, however its unusable, as there are no ‘Create’ or ‘Edit/Details’ options.
Configure ”Entity Form Metadata’:
With ‘Entity Form Metadata’, we can make sub grid usable. We can add actions (i.e.,Create/Edit/Details buttons) and to the sub grid.
- Go to ‘Employee’ form site map and click on ‘Entity Form Metadata’
- Under the ‘Type’ select ‘Subgrid’ and choose your ‘Subgrid Name’
- Next, we need to configure ‘Create’ and ‘Edit’ buttons to the sub grid.
- Under the ‘Grid Configuration’ tab, click on ‘Create’ and fill the ‘Entity Form’ (i.e.,Child Create) details
- To add, Edit/Details action click on ‘Details’ and fill the ‘Entity Form’ details
- Note: Even though, I choose ‘Details’ action, my associated ‘Entity Form’ (i.e.,Child Details) is set form mode ‘Edit’ which can be used to view and edit.
- Save the ‘Entity Form Metadata’.
Test the functionality:
- Login to your portal
- Clear the Portal Cache by navigating to “Portal URL+‘/_services/about’”
- Note: This step is optional and needed only if you don’t find your changes in portal
- Open the ‘Employee’ record and now you should see ‘Child’ grid with ‘Add new child’ button.
- Click ‘Add new child’ button and it will open up ‘Child Create’ entity form.
- Click ‘Submit’ which saves the record.
- Now either click on 1st column or ‘Details’ button to ‘Edit’ the record which opens up ‘Child Details’ Entity form.
- Modify the data, if needed and click ‘Submit’
🙂
ADX Portals 7.x – ‘Page_Validators’ is undefined
Other day, while adding a custom validator using JScript on an Entity Form, I was getting ‘Page_Validators’ is undefined error, at below line of code.
// Add the custom validator to Web Page’s validators array
Page_Validators.push(spouseValidator);
Reason:
- The dynamics CRM form, associated to the ADX Entity Form, does’t have any required field, hence ‘Page_Validators’ array is NULL as ADX did’t need to load any validators.
Fix:
- ‘Page_Validators’ is a validator collection and we dont have control over this.
- Below workaround worked for us:
- Make one of the field as ‘Required’ by adding ‘Entity Form Metadata’. ADX instantiates ‘Page_Validators’ array, as there is Required field now.
- You can make the field as Non-required in the JScript.
Note:
- This behavior is fixed in further versions of ADX and Dynamics Portals.
🙂
D 365 – How to access Customization’s and Solutions in UCI Only Mode
To know more about ‘Unified Interface Only mode’ refer my previous article
Below are the steps to access environment settings, customization’s and solutions when the ‘Unified Interface Only mode’ turned on.
- Click on ‘Advanced Settings’ from the ribbon
.
- It will open up ‘Settings’ tab in classic web mode.
- You can access your solutions and make customizations how you used to do earlier.
Refer the documentation to know more about ‘Unified Interface’.
🙂
D365 – How to turn On/Off ‘Unified Interface Only mode’
Today, I subscribed to my new D365 30 days trail and noticed the ‘Sales’ web Application opening up in ‘Unified Interface’ mode rather than in Classic web mode by default.
When noticed, the URL of the Dynamics landing page (My Apps) has a parameter forceUCI=1
It seems that Unified Interface ONLY mode has been implied on my new instance.
What is Unified Interface Only mode?
- As per the documentation, Microsoft product team wants us to adopt to UCI (Unified Client Interface), to provide superior performance and usability.
- All the new Dynamics 365 for Customer Engagement environments (instances) and Common Data Service environments, will be provisioned in Unified Interface Only mode.
Enable/Disable Unified Interface Only mode:
- To Enable/Disable Unified Interface Only mode, navigate to ‘Settings’ tab by clicking on ‘Advanced Settings’ from the ribbon .
- Open Settings -> Administration -> System Settings
- Select the option under ‘Use the new Unified Interface only (recommended)’ section.
Accessing the legacy web client app:
- The legacy web client app, also known as Dynamics 365 – custom, is hidden from end users when a new environment is provisioned.
- It is always visible to those with System Administrator and System Customizer roles, and to other custom roles with similar privileges.
- To enable the Legacy App to non-admin users,
- Go to Settings > Administration > System Settings > General tab. Under Show legacy Dynamics 365 – custom app, select Yes for Show this app to all users, not just administrators.
- In the Power Platform Admin center, go to Environments and select an environment. Go to Settings > Behavior > Interface settings and then turn on Show legacy app to everyone, not just admins.
- Note:
- When ‘Unified Interface Only mode’ is enabled, Dynamics 365 – custom opens in Unified Interface and not in the legacy web client.
- Legacy app opens only If users only have access to the Dynamics 365 – custom app and no other model-driven apps.
🙂
ADX/Dynamics Portals Issue – Missing Entity ‘Tab’ in ‘Web Form Step’
We have ADX portal 7.0 solution installed on our Dynamics 365 8.2 application. We got a requirement to create a Web Form steps on a Custom Entity ‘Employee’.
‘Employee’ entity has an OOB ‘Information’ of ‘Form Type’ Main, with a tab named ‘Personal Details’.
Issue:
- While adding a Web Form step, there was no ‘Personal Details’ tab and could get only ‘general’ tab.
- In the new ‘WEB FORM STEP’, select the ‘Form Name’
- In the ‘Tab Name’ drop down, there is no ‘Personal Details’ tab and all it had was ‘general’ tab.
Reason:
- As there were 2 OOB forms (i.e., Form Type ‘Main’, ‘Mobile – Express’) with the same name ‘Information’, ADX solution always picking ‘Mobile – Express‘ form which had a tab ‘general’
Fix:
- Renamed ‘Information’ Main form to ‘Employee’.
- Publish the solution
- Refresh the ‘Web Form Step’ and you should see ‘Personal Details’ tab once you select the ‘Employee’ form.
🙂
Badges
