Filtering Dependent Picklist(OptionSet) Javascript for Quick Create Form Microsft Dynamics CRM 2013

Quick create form is a new feature of Microsoft Dynamics CRM , that could be enabled for forms to create a new related record inside the CRM without opening new form and leaving the current form that you are working on. it’s making easy creating records on the fly but make it harder to create java script function on this kind of form.

Quick Create Form purpose is different from main forms and they don’t support all the capabilities of main forms. The following controls cannot be added to quick create forms:

 

  • Sub-grids
  • Quick View Forms
  • Web resources
  • IFRAMEs
  • Notes
  • Bing Maps

Also some other CRM JavaScript controls are not supported in quick create form like Xrm.Page.getControlor Xrm.Page.getAttribute , …

so in order to implement dependent option-set (pick-lists) in quick form we can use JavaScript and JQuery  directly in the form. Although it’s not supported customization, I couldn’t find any supported client side solution for this.

here are the steps for implementing dependent picklist in  create quick form CRM 2013:

Scenario:  I have two option-set issue (new_issue) and issuesubtype(new_issuesubtypewhich the issue sub type should be filtered based on the values in issue option-set. I’m going to filter it based on the appearance of text values from issue to issue sub type. So if issue = electrical the function would find all the issuesubtype  contains electrical string in it.

Use below code on change event of first option-set(issue):

function IssueType_OnChange_Iframe() {

var showOnlyOptionsSimilarToText = function (selectionEl, str) {

// cache the jQuery object of the <select> element
var el = $(selectionEl);
if (!el.data("options")) {
//cache all the options inside the <select> element for easy recover
el.data("options", el.find("option").clone());
} debugger;
try {
if (el.length != 0)
var newOptions = el.data("options").filter(function () {
var text = $(this).text();
if (text != null || text != '') {
return text.match(str);
}
});
el.empty().append(newOptions);
}
catch (err) {
var error = err.message;
}
};

var userInput = $('#new_issue')[0].title;
showOnlyOptionsSimilarToText($("#new_issuesubtype_i"), userInput);
}

In order for this code to work you should add JQuery to your form.

This code only look at text values selected in first optionset and filter the second one based on that text value.

the second optionset id is new_issuesubtype but  I used the id of the second optionset select tag.(you can get it using IE developer or firebug)

<select tabindex=”-1″ title=”” class=”ms-crm-SelectBox ms-crm-Inline-OptionSet-AutoOpen” id=”new_issuesubtype_i” aria-labelledby=”new_issuesubtype_c new_issuesubtype_w” size=”10″ defaultSelected=”” attrName=”new_issuesubtype” attrPriv=”7″ controlmode=”normal” defaultvalue=””>

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s