Advertisements

Archive

Archive for the ‘ADX’ Category

Web Development – Useful jQuery Syntax’s

In this article, I am compiling the useful jQuery syntax’s which comes handy during your Dynmaics/ADX portal development or any other web development.

Prerequisite

  • Add jQuery library to your web page using <script> tag.
  • You can get the jQuery CDN here

Get Operations:

  • Get HTML element by Id

$(“#HTMLelementId“)

  • Get element by Class name

$(“.ClassName“)

  • Get element by ‘partial’ Id name.
    • As an example, if you want to get a Checkbox control which has ID ‘myChkBox‘, you can either get the element using full id with $(“#myChkBox”) or use partial id $(“[id$=’ChkBox‘]”).

$(“[id$=’PartialId‘]”)

  • Get Value

$(“#HTMLelementId“).val()

  • Get selected drop down text

$(“#DropdownId option:selected”).text()

Set Operations:

  • Set Text box

$(“#HTMLelementId“).val(“Hello World”);

  • Set Checkbox

$(“#checkboxId“).prop(“checked”, true); //true is checked; false is unchecked.

Add or Remove Class

  • $(“#HTMLelementId“).addClass(“YourClassName“); // Add Class
  • $(“#HTMLelementId“).removeClass(“YourClassName“); // Remove Class

Hide/Show Element

  • Hide element

$(“#HTMLelementId“).hide();

  • To hide Parent
    • This is useful to hide a control along with Label.

$(“#HTMLelementId“).parent().hide()

  • Show element

$(“#HTMLelementId“).show();

Check if elements exists

if ($(“#HTMLelementId“).length > 0){}

Iteration syntax

  • Loop through all Radio boxes which set to False.

$(“input[id][type=’radio’][value=’0′]”).each(function () {
var radioBox = this;
});

Attach events to HTML elements

  • To add ‘keypress’ event to Text box

$(“#HTMLelementId“).on(“keypress”, keyPressHandler);

function keyPressHandler(){
// Read the textbox value
var controlValue = this.val();
}

Remove event handler

  • To remove ‘onChange’ event from a control use ‘unbind’ method.

$(“#dropDownID“).unbind(“change”);

Trigger event

  • To trigger button ‘Click’ event

$(“#ButtonId“).click();

Remove option from Drop down:

  • Below script, removes ‘Mango’ from the Drop down control.

jQuery(“#dropdownId option:contains(‘Mango’)”).remove();

Read Query String Parameter

  • To read ‘country’ param value from current URL http://helloworld?country=India, call getParamValue(‘country’)
  • Function will return false, if no matching param found.

function getParamValue(paramName) {
var results = new RegExp(‘[\?&]’ + paramName + ‘=([^&#]*)’)
.exec(window.location.search);

return (results !== null) ? results[1] || 0 : false;
}

Get/Set elements in IFrame

  • To Get or Set the values of elements in IFrame, below is the syntax.

$(“#YourIframeID“).contents().find(‘#txtBoxId‘).val(); // Get the value

$(“#YourIframeID“).contents().find(‘#txtBoxId‘).val(“Hello World”); // Set the value

  • To access IFrame with in another IFrame

$(“#Iframe1ID“).contents().find(“#Iframe2ID“).contents().find(‘#txtBoxId‘).val(“Hello World”);

Create a new element:

  • Below is the snippet to create HTML button and add that next to an existing HTML element.

$(‘<input type=”button” id=”newBtn” class=”Your class name” value=”My New Button”/>’).insertAfter($(“#existingHTMLElementId“));
$(“#newBtn”).click(function () {

// Write your onclick script here
});

Advertisements
Categories: ADX, CRM Tags: , ,

ADX Portals – adx_webformsession.adx_currentwebformstep is null

I got following exception while navigating through my ‘Web Form’ steps in ADX Portal.

adx_webformsession.adx_currentwebformstep is null

Reason:

  • I had redesigned a ‘Web Form’ by deleting couple of existing ‘Web Form’ steps.
  • However the associated ‘Session’ records, of deleted ‘Web Form’ steps, were still exists in the system causing the specified issue.

Fix:

  • Delete all orphan ‘Web Form Sessions’ records from the system.
  • Query all the ‘Web Form Sessions’ records which does not contain a ‘Web Form’, using ‘Advanced Find’ as below.

Portal_Session_1

  • Delete all records.

Portal_Session_2

  • Clear Portal Cache
  • Issue should go away.

🙂

ADX Portals – Clear Cache On Web Page Submission

Adxstudio Portal application caches the results from Dynamics CRM to improve the performance.

But, there are times, where we need to override (invalidate) cache behavior to show latest data on Portals. Lets take a scenario

  • My Portal has a ‘Contact’ web page and up on ‘Submit’, a plug-in updates all the associated ‘Cases’ in the background.
  • Now, on Portal, navigate to ‘Cases’ entity list Web Page, which should show the latest ‘Cases’ data, which has been updated by plug-in in above step.

In above scenario, we will not get the latest ‘Cases’ due to Portal Cache behavior.

So what are the ‘Cache Invalidation’ options?

  • Manual Cache Invalidation:
    • This option is to manually hit the JavaScript bookmark-let  as specified here.
    • Drawback:
      • Its not viable, to ask portal users to hit the URL every time they ‘Submit’ the ‘Contact’ web page
  • Web Notifications:
    • A Web Notification Plugin registered with the Adxstudio Portals solution in CRM is triggered on all entity create, update, delete, disassociate, associate, publish, and publish all messages and notifies the Web Notification URLs defined in the CRM to invalidate the cache so the users visiting the portal get the recent data changes
    • Drawback:
      • A ‘System Job’ gets created up on update of the entity, and the execution may get delayed based on the occupancy of CRM Async Service Job.
      • This is not fool proof solution.

ADX Cache_1

We took an approach to automate the ‘Manual Cache Invalidation’ process to fetch the latest CRM data.

Our Cache Invalidation Approach :

  • Create a new ‘Web Page’ and paste below ‘Manual Cache Invalidation JavaScript’ code in ‘Custom JavaScript’ field.
    • Note: You don’t need to associate any ‘Web Form’, ‘Entity List’ or ‘Entity Form’ to this Web Page.

$(document).ready(function () {
var url = document.location.protocol + ‘//’ + document.location.host + (document.location.host.indexOf(“demo.adxstudio.com”) != -1 ? document.location.pathname.split(“/”).slice(0, 3).join(“/”) : “”) + ‘/Cache.axd?Message=InvalidateAll&d=’ + (new Date()).valueOf();
var req = new XMLHttpRequest();
req.open(‘GET’, url, false);
req.send(null);
// Redirect to Portal Home Page
window.location.href = ‘../’;
});

  • In below screen, I created a new Web Page ‘Portal Cache Clear’ and copied the above script.

ADX Cache_2

  • So, to invalidate ‘Cache’ on the ‘Submit’ of any of your Portal form, In Entity Form’s ‘On Success Settings’, Redirect to Cache ‘Web Page’ as configured in below screen.

ADX Cache_3

  • That’s it. Your portal should invalidate cache, up on Entity Form submission. One caveat of this approach is, ‘Portal Cache’ web page will flash for few seconds before redirecting to portal’s ‘Home’ page.

Note:

  • This Information is Relevant to Legacy Adxstudio Portals Only.
  • Dynamics 365 Portal Add-on’s Do Not Require this Configuration.

🙂

 

 

Categories: ADX Tags: ,

[Code Snippet] Dynamics Portals/ADX – Set ‘Field Requirement’ using script

April 28, 2019 1 comment

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.

ADXJ_1

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

ADX-G_7

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’

ADX-G_2

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

ADX-G_4

  • Create a new ‘Page Template’ and map the newly created ‘Web Template’

ADX-G_6

  • Create a “Web Page’ and map the ‘Entity List’ and ‘Page Template’

ADX-G_5

  • That’s it. Go to Portal, clear cache and hit the ‘Web Page’ URL. You should see grid with ‘Check Box’ as first column.
ADX-G_1

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″>
&nbsp;
</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 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.

Metadata_1

Note:

  • This behavior is fixed in further versions of ADX and Dynamics Portals.

🙂