You are currently browsing the tag archive for the ‘JScript’ tag.

Continuing with THIS series of posts, today we are looking at using the Flot JScript library for visual rendering of data. Flot is a great little library for charting. It is available from HERE.

The Flot library has a few graphing variations available, and we can easily change the CSS as needed to make it look even more appealing. The idea is that presenting information visually will make our users so much faster, and more inclined to quickly glance to see what’s going on, rather than deep dive.

In this short article we focus on the Flot pie charts. What we will achieve is this:

image

Notice how, for the purpose of this demo, I have left the available rendering option buttons on the form. You can change the rendering type as needed, until you figure out which is the best to use. I like to do that with customers because giving them choice empowers them and engages them in the discussion.
Read the rest of this entry »

Advertisements

Keeping in line with a previous article about using the Bootstrap library with Dynamics CRM, in this article we will look at using another JScript library.

This mini-series of articles relates to the topic I’ve presented at eXtreme CRM this year. It all revolves around visual presentation at the record level. While Dashboards are nice, humans are “visual animals”, and as such, presenting information visually at the record level is not only eye-candy, but also can make a user of the system more productive, and more eager to adopt a new tool.

The previous articles in this mini-series are:

HTML Web Resource in Dynamics CRM

HTML Web Resource in Dynamics CRM [2]

Bootstrap Progress Bar in CRM

We’re going to be looking now at Easy Pie Chart. There are two reasons I like this library. First off, it is very light. Second, I like the animation. Makes it more “look here first” like. I’ll be using it as is, with no visual customizations, but if you want, feel free to tinker with the CSS.
Read the rest of this entry »

With Dynamics CRM 2013 now we have even more opportunities to play with the UI. We have more choice with regards to layout, more choice with regards to user experience, and implicitly more opportunities to make it better for the user. But, once we start to analyze the user experience, we could find that we’re missing a lot by not being able to do everything we can do on a regular web page. Or, can we?

NOTE: some of the items presented in this post are not officially “supported”, and should only be used with that in mind.

A previous post was describing the proper way to use jQuery in the context of Dynamics CRM. See more details HERE.

In this post I’m going to be talking about Twitter Bootstrap, and how we can leverage it in the context of Dynamics CRM 2013. We want to add a progress bar to our Case form, to show graphically how far we are in resolving this case. It should look something like this:

image

First off, head to getbootstrap.com and download the files.

image

Extract the files, and you will get this structure:

image

Go in the css folder, and get the bootstrap.min.css file. also, from the js file get the bootstrap.min.js file. We will be using the min files for better performance.

Now, in your CRM environment, load these as web resources.

In addition, create a new JScript web resource that will hold our custom script. Let’s name this one new_bootstrap_case as we want to make our modifications on the Case form. The structure should look as follows:

image

Now, let’s add the following script to the OnLoad of the Case form:

function AddProgressBar() {
    // add the CSS reference

    var _css = "WebResources/new_bootstrap_css";
    var _cssref = document.createElement("link");
    _cssref.setAttribute("rel", "stylesheet");
    _cssref.setAttribute("type", "text/css");
    _cssref.setAttribute("href", _css);
    $("head").append(_cssref);

    // add the progress bar
    var _innerHTML = "";

    _innerHTML += "<div class=’progress progress-striped’ width=’100%’>";
    _innerHTML += "<div class=’progress-bar progress-bar-success’ role=’progressbar’ aria-valuenow=’40’ aria-valuemin=’0′ aria-valuemax=’100′ style=’width: 40%’>";
    _innerHTML += "<span class=’sr-only’>40% Complete (success)</span>";
    _innerHTML += "</div>";
    _innerHTML += "</div>";

    $("h2.ms-crm-Form").prepend(_innerHTML);
}

 

Basically, we are doing two things here:

In the first part, we are adding our CSS web resource to the page. This will help us with the rendering of the progress bar.

The second part of the function simply generates the HTML required to render the progress bar. In this example I am setting it to 40% by default, but you can define the value as needed based on your current business rules.

Your form properties will look as such when done:

image

Now, open a Case form, and find your new progress bar rendered as such:

image

Enjoy!

Just a quick note, for those implementations taking advantage of script customizations, if you are using

Xrm.Page.ui.getCurrentControl

when upgrading to UR2, remember to check your scripts. This method is now deprecated.

For more details see HERE.

Happy scripting!

This is another new feature of Dynamics CRM 2013. While in previous versions, we used to use JScript alerts to bring up field specific messages on forms, now we have two new functions available:

setNotification(“message”);

and

clearNotification();

So how do we use then, and what do they do?

First off, let’s bring up a message on a field if a condition is met, or clear it otherwise:

function SetCustomNotification(controlName, controlMessage)
{
    var field = Xrm.Page.getControl(controlName);
    var condition = [evaluate your condition here];
    if (condition)
    {
        field.setNotification(controlMessage);
    }
    else
    {
        field.clearNotification();
    }
}

Pass in strings for controlName and controlMessage.

Set your function on either the onChange event of the field, or on the onSave event of the form. If you set it on form save, it’s a good idea to stop the save if the condition fails and the message comes up.

And the end results is your custom message showing as below:

image

Enjoy!

This quick snippet comes in handy every now and then, and now it’s also tested for Dynamics CRM 2013.

Scenario:

I have a bunch of organizations, and a set of Organization Types. Let’s say, we have various client types, with various SLA’s.

In the Case entity, I want to show only the Organizations of specific type(s), that I can support through Cases.

Solution:

First off, create a new web resource if one is not already created for the Case entity.

Then, from the form load event, call this function which uses addPreSearch.

function preFilterLookupOrganization() {   
    Xrm.Page.getControl("control_name").addPreSearch(function () {
        addLookupFilter();
   });
}

This is from the SDK:

addPreSearch

Use this method to apply changes to lookups based on values current just as the user is about to view results for the lookup.

JavaScript 
Xrm.Page.getControl(arg).addPreSearch(handler)

Arguments
Type: Function to add.
Remarks
This method is only available for Updated Entities.

The argument is a function that will be run just before the search to provide results for a lookup occurs. You can use this handler to call one of the other lookup control functions and improve the results to be displayed in the lookup.

 

Next let’s build the handler. We’re building the filter query and add the filter to our control as such:

function addLookupFilter() {
    var myControl = Xrm.Page.getAttribute("control_name").getValue();

    if (myControl != null) {
        fetchXml = "<filter type=’and’><condition attribute=’customertypecode’ value=’1′ operator=’eq’/></filter>";
        Xrm.Page.getControl("control_name").addCustomFilter(fetchXml);
    }
}

Now, it’s all in the filter, and the current example only looks for one specific Organization type. You can build that fetchXml filter as complex as needed, either by pulling if from an advanced find, creating it by hand, or using a 3rd party tool.

Enjoy!

Microsoft Business Solutions MVP

Check out my course [Video]

Getting Started with Dynamics 365 Customer Engagement

Reviewed Book

Implementing Microsoft Dynamics 365 for Finance and Operations

Implementing Microsoft Dynamics 365 for Finance and Operations

Reviewed Book

Microsoft Dynamics 365 Extensions Cookbook

Microsoft Dynamics 365 Extensions Cookbook

Check out my Book

Microsoft Dynamics CRM 2016 Customization - Second Edition

Microsoft Dynamics CRM 2016 Customization - Second Edition

Check out my Book

Microsoft Dynamics CRM Customization Essentials

Microsoft Dynamics CRM Customization Essentials

Check out my Book

Microsoft Dynamics CRM 2011 Scripting Cookbook

Microsoft Dynamics CRM 2011 Scripting Cookbook

Reviewed Book

Microsoft Dynamics CRM 2011: Dashboards Cookbook

Microsoft Dynamics CRM 2011: Dashboards Cookbook

Enter your email address to subscribe to this blog and receive notifications of new posts by email.

Join 487 other followers

Follow Dynamics 365 Wizardry on WordPress.com