CRM

Show and Hide Section Based on Option Set Field Using JavaScript In Microsoft Dynamic CRM

In this blog, we will learn about How to Show and Hide Section Based on Option Set Field Using JavaScript In Microsoft Dynamic CRM.
Here I explain step by step How to Show and Hide Section Based on Option Set Field Using JavaScript In Microsoft Dynamic CRM.

Step 1.Open your newly created Entity “ShowHideSection” and click on form.After that open Form Type “Main”.Looks like Screenshot.

Step 2.This step is important.When you click on Main Form New Window is open and then here we add two “Section”. Click on Insert->Section->One Column.

Step 3.Click on Section after that Click on Change properties. Change Here Section name and Label name.Same task will do for Second Section.

Step 4.This step is important here we add one”Option Set” field on Main Form. Click on New Field.

Step 5.Write the Name of “Option set field” on Display name Fied and select data type “Option Set”.

Step 5.After that click on Plus Symbol and add Item and change the label name and Value.
Finally, Click on “Save and close Button”.

Step 6.After that drag and drop option set field in General Tab.

Step 7.Next Step to add “Web Resources”.Click On Web Resources and then Click on New Button.

Step 8.Write the name of web resources in Name Field and Display Name Field after that select type “Script(JScript)” and Select Language after that click on “Text Editor” button like Screenshot.

Step 9. Write this Code on Text Editor and Click On “OK” button.

// JavaScript source code

function ShowhideSection() {
	//retrieve here option set selected value into value 
	var value = Xrm.Page.getAttribute("new_showhidesection").getValue();
	//Check here value contain any value or null
	if (value != null) {
		//if value equal to one
		//write here tab name which contain option set field like "General Tab"
		//In Section.get pass section name if you want to show and hide
		//For show section set visibility true
		//and for hide section set Visibily False
		if (value == 1) {

			Xrm.Page.ui.tabs.get("generalTab").sections.get("firstSection").setVisible(true);

		}
		else if (value == 2) {
			Xrm.Page.ui.tabs.get("generalTab").sections.get("firstSection").setVisible(false);
		}
		else if (value == 3) {
			Xrm.Page.ui.tabs.get("generalTab").sections.get("secondSection").setVisible(true);
		}
		else if (value == 4) {
			Xrm.Page.ui.tabs.get("generalTab").sections.get("secondSection").setVisible(false);
		}
		else {
		}
	}
}

 

Step 10.After that Click on “Save” and “Publish”.

Step 11.After that open your “Main Form” where you add “Option Set” Field. Double click on “Option Set” or single click on “Option Set” and after that Click on “Change Properties”.When You are double click on “Option Set Field” New window is open then click on Events. Here we add a web resources file name in File Libraries and write the name of Function “ShowhideSection” on “OnChange” Events and after that click on “Add” button.

Step 12.Write the name of javascript function name in funcion field then click Ok button.

Step 13.After that finally Save and Publish your form.
Step 20.Final Step refresh your page and click on the area where you are entity add. You can see show your Entity Name like “ShowHideSection”.Open Your Entity and click on the options set field you can see easily fulfill your requirement. Screenshot describe the output.

Any Question and suggestion related to this article”Show and Hide Section Based on Option Set Field Using JavaScript In Microsoft Dynamic CRM” please Comment Me.

Leave a Reply

Your email address will not be published. Required fields are marked *