1.
Create two custom attributes to store selected
value and selected text from check box list.
2.
Add both attributes on form, this is required,
it is not required to show those attributes on form, but those need on Form, so
that JavaScript code will find those attributes.
3.
Add
latest JQuery library in form library
4.
Create HTML web resource and add following code in
HTML web resource
<html><head>
<title></title>
<script type="text/javascript" src="new_jquery_1.10.2.js"></script>
<script type="text/javascript">
//
function will be called when web resource is loaded on Form.
$(document).ready(function () {
ConvertDropDownToCheckBoxList();
});
//Coverts
option list to checkbox list.
function ConvertDropDownToCheckBoxList() {
var dropdownOptions = parent.Xrm.Page.getAttribute("new_makeyear").getOptions();
var selectedValue = parent.Xrm.Page.getAttribute("new_selectedyears").getValue();
$(dropdownOptions).each(function (i, e) {
var rText = $(this)[0].text;
var rvalue = $(this)[0].value;
var isChecked = false;
if (rText != '') {
if (selectedValue != null &&
selectedValue.indexOf(rvalue) != -1)
isChecked = true;
/* Remove spaces before input, label word and end tags of input &
label*/
var checkbox = "< input type='checkbox' name='r'/ >< label>
" + rText + "</ label>"
$(checkbox)
.attr("value",
rvalue)
.attr("checked",
isChecked)
.attr("id", "id" +
rvalue)
.click(function () {
//To Set Picklist Select Values
var selectedOption =
parent.Xrm.Page.getAttribute("new_selectedyears").getValue();
if (this.checked) {
if (selectedOption == null)
selectedOption = rvalue+"";
else
selectedOption = selectedOption + "," + rvalue
}
else {
var tempSelected = rvalue + ",";
if (selectedOption != null) {
if
(selectedOption.indexOf(tempSelected) != -1)
selectedOption = selectedOption.replace(tempSelected, "");
else
selectedOption = selectedOption.replace(rvalue, "");
}
}
parent.Xrm.Page.getAttribute("new_selectedyears").setValue(selectedOption);
//To Set Picklist Select Text
var selectedYear =
parent.Xrm.Page.getAttribute("new_selectedyeartext").getValue();
if (this.checked) {
if (selectedYear == null)
selectedYear
= rText+"";
else
selectedYear = selectedYear + "," + rText
}
else {
var tempSelectedtext = rText + ",";
if (selectedYear != null) {
if
(selectedYear.indexOf(tempSelectedtext) != -1)
selectedYear = selectedYear.replace(tempSelectedtext, "");
else
selectedYear = selectedYear.replace(rText, "");
}
}
parent.Xrm.Page.getAttribute("new_selectedyeartext").setValue(selectedYear);
})
.appendTo(checkboxList);
}
});
}
</script>
<meta charset="utf-8">
<meta><meta><meta><meta></head><body style="word-wrap: break-word;">
<div id="checkboxList">
</div>
</body></html>
Change new_makeyear with option set schema name.
Change new_selectedyears with custom
attribute which is storing selected values.
Change new_selectedyeartext with custom
attribute which is storing selected Text.
1.
Add HTML web resource on Form.
2.
Save and publish your customization.
Final output will be like
Hi Mahadeo,
ReplyDeleteIs there any reason this solution won't work on CRM 2015? I've followed your instructions, but cannot get anything to happen when I add the fields and web resource to the Contacts entity. IE developer tools aren't showing any errors.
Cheers
Chris
Hi Chris.
ReplyDeleteThere should not be any problem with CRM 2015. I havn't tested it on 2015 CRM.
Can you please check in your web resource, it have onload function
< body onload="ConvertDropDownToCheckBoxList()" >
Some times I seen this problem, when modifying web resource from CRM, onload function is removed. Make sure you are calling onload function.
Here is complete code in Manged solution.
https://onedrive.live.com/redir?resid=313f10ae62a84b48!3918&authkey=!AKuuPmyi6TtEW8A&ithint=file%2czip
Please let me know if you have still problem.
Hi guys,
ReplyDeleteI am not developer more CRM power user. Can you describe me where and how do I insert the code? As the Output I only do net go get check box list of 7 items.
Thanx
Tom
Hi Tomoas,
ReplyDeleteYou need to first create HTML web resource.. and add above code in HTML web resource.
In code you need to change attribute names like new_makeyear, new_selectedyears with your attribtues.
and then need to add HTML web resource on form where you want to show check box list instead of dropdown.
Here are some links related to CRM web resources
Webpage (HTML) web resources
HTML Web Resources
Hi Mahadeo,
ReplyDeleteHow do you create the attribute (entity) so that it populates selected value and label? I have added my custom entities as single line text data types but this solution is not working. I am just getting html loaded in my web resource control when I test.
Thank you,
Ryan
Hi Mahadeo,
ReplyDeleteI am trying to implement this but on the form the code itself keeps appearing instead of the checkbox list. what am I doing wrong?
Do you need to somehow call the "ConvertDropDownToCheckBoxList" function on the form? If so, how?
I am not a programmer.
You need to create HTML web resource and add code given in post into HTML web resource and put HTML web resource in Form.
ReplyDeleteOnce web resource added in Form, save your changes and Don't forgot to PUBLISH your changes.
Until you are not publishing changes, CRM will not show changes.
Thanks,
ReplyDeleteI was able to get it working using the managed solution you provided, but when I check a box I get a Invalidtype error.
I'm having some issues implementing this. I've added the field for the choice set, 2 seprate multi line text box fields [one for storing values, and one for storing text]. I added the html web resource [replacing with the name of my fields] and then added that web resource to the form. When I add the web resource to the form, it looks like it adds it as a new field. When I open up the form I see the choice set there, but its still a drop down. I'm not sure what I'm doing wrong.
ReplyDeleteTo correct the InvalidType error change line
ReplyDeleteparent.Xrm.Page.getAttribute("new_selectedyeartext").setValue(selectedOption);
to
parent.Xrm.Page.getAttribute("new_selectedyeartext").setValue(selectedOption.toString());
This comment has been removed by the author.
ReplyDeleteHi Mahadeo Matre...
ReplyDeleteThanks fro your solution ...
1.how can I clear the un-check values in the below test field ?
2.When I check the values ,values is populating in the below field and when I un-check and check the same value also the values is populating again
How can I clear this
Hello, I have done this the manual way and by importing your solution, but I am getting the following error when my contact form loads.
ReplyDeleteReferenceError: ConvertDropDownToCheckBoxList is not defined
Hi,
DeleteDo you have function ConvertDropDownToCheckBoxList() in your code?
make sure there is not any other javascript error, it might be you are missing some brackets or some syntax error in javascript.
Hi Mahadeo,
ReplyDeleteI have tried this solution in CRM 2016 on prem but it doesnt work. It just displays an empty webresource. Is this compatible with CRM 2016?
Yes, it is compatible with CRM 2016.
DeleteMake sure you have Jquery library added to your form library, also add debugger and see where the error is coming.
It might be when you are getting option set values from CRM, your attribute name is different.
Thank you Mahadeo, appreciate your help. I was able to fix the error by looking at the debugger. But now the webresource shows the HTML code instead
Delete< input type='checkbox' name= 'r' / >< input type='checkbox' name= 'r' / >< input type='checkbox' name= 'r' / >
No error in the debugger as well. Any help is appreciated.
Hi,
DeleteYou need to remove spaces in HTML tag
var checkbox = "< input type='checkbox' name='r' / >" + rText + ""
There are some extra space added before "input" and at the end. Also it might be label will not be shown for checkbox, so change this line as
var checkbox = "< label> < input type='checkbox' name='r' / >" + rText + "< / label>"
Sir, you rock! Thank you so much. Appreciate all the help!.
DeleteOne last question, the debugger shows this error now and I havent been able to resolve it.
Deletevar tempSelected = rvalue + ",";
if (selectedOption.indexOf(tempSelected) != -1)
SCRIPT 5007:unable to get property 'indexof' of undefined or null reference
I changed the code to:
var tempSelected = rvalue + ",";
if ($.inArray(selectedOption,tempSelected) != -1)
But then it throws
SCRIPT 5007:unable to get property 'replace' of undefined or null reference
at:
selectedOption = selectedOption.replace(rvalue, "").
Update code as follows for checkbox click event
Delete$(checkbox)
.attr("value", rvalue)
.attr("checked", isChecked)
.attr("id", "id" + rvalue)
.click(function () {
//To Set Picklist Select Values
var selectedOption = parent.Xrm.Page.getAttribute("new_selectedyears").getValue();
if (this.checked) {
if (selectedOption == null)
selectedOption = rvalue+"";
else
selectedOption = selectedOption + "," + rvalue
}
else {
var tempSelected = rvalue + ",";
if (selectedOption != null) {
if (selectedOption.indexOf(tempSelected) != -1)
selectedOption = selectedOption.replace(tempSelected, "");
else
selectedOption = selectedOption.replace(rvalue, "");
}
}
parent.Xrm.Page.getAttribute("new_selectedyears").setValue(selectedOption);
//To Set Picklist Select Text
var selectedYear = parent.Xrm.Page.getAttribute("new_selectedyeartext").getValue();
if (this.checked) {
if (selectedYear == null)
selectedYear = rText+"";
else
selectedYear = selectedYear + "," + rText
}
else {
var tempSelectedtext = rText + ",";
if (selectedYear != null) {
if (selectedYear.indexOf(tempSelectedtext) != -1)
selectedYear = selectedYear.replace(tempSelectedtext, "");
else
selectedYear = selectedYear.replace(rText, "");
}
}
parent.Xrm.Page.getAttribute("new_selectedyeartext").setValue(selectedYear);
})
.appendTo(checkboxList);
Thank you sir! No errors now. Appreciate all the help. But now I am trying to figure out why arent the fields populating when I select a check box. No errors though in the debugger.
DeleteYou need to check what values are set
Deleteparent.Xrm.Page.getAttribute("new_selectedyears").setValue(selectedOption);
or
parent.Xrm.Page.getAttribute("new_selectedyeartext").setValue(selectedYear);
Check what values are coming in selectedOption and selectedYear variables.
Also try for some other records.
I threw an alert to check what value was set to selectedOption and it returns a null value. Looks like it doesnt go in to the if(this.checked) loop. Alert on (this.checked) returns undefined. Am not sure what I am doing wrong but cant get it to work :(
DeleteThank you so much for all your responses you have been very helpful, appreciate your time and all the help
Okay so I finally got it working instead of this.checked we need to use $('#checkbox').is(':checked') and it works like a charm.
DeleteHello Mahadeo.
ReplyDeleteThank you for this code. It has helped me immensely. However, I noticed that the data is not actually stored on the server and every time I refresh the page, the checks disappear in the check boxes. Do you have an solution or would it require editing Dynamics 365 through visual studio?
To store data on server you need to save record. This code is not saving record.
Deletei followed s u said but no execution, no error here i just changed field names, added jquery, added web resource of html thats it is there anything to do.
ReplyDeleteHi,
Deletedid you published your changes, also you can add debugger and check is JavaScript is executing or not.
pls rply regarding this
ReplyDeleteThanks this working for me.... :)
ReplyDeleteGreat! It works! However the option set field cannot be used in the advanced search but remains empty. How can this be solved? Thank you
ReplyDelete