Wednesday 14 October 2009
We had a requirement to customise the left-hand menu navigation options on an account record.This cannot be done natively within Dynamics CRM, however there are a number of different options that will allow you to do this, including JavaScript entered into the OnLoad event of the record.
To make life even more difficult, we wanted to give users the ability to hide and show these navigation options themselves. Sounds tricky, but actually its not as difficult as it sounds. We found a nice, clean way of doing this as follows (Download Full Document):
First, navigate in CRM to Customisation\Customize Entities\Account\Forms and Views\Form. Open the form record and create a new Tab called Navigation Options. O n this tab create a section called “Standard Entities”:
Then, you need to create all the Attributes needed for your form. This process works for Standard Entities as well as Custom Entities, so adjust as you need. For this example we created the Attributes needed for our Navigation Options Tab using the Bit type and changing the names of the values as shown (listed below). We also decided we would want to hide the navigation options tab itself so we created an Attribute for this purpose, configured the same as the other.
Attributes Created (Navigation Options Tab):
- Moreaddressesnavoption
- Activitiesnavoption
- Historynavoption
- Sub-accountsnavoption
- Contactsnavoption
- Relationshipsnavoption
- Workflows
Attributes Created (Hide/Show Navigation Options Tab Itself):
- Show/Hidenavtab
Next, add the Attribute to show/hide the navigation options tab itself to the tab of your choice. We chose to add it to the bottom of the Administration Tab as shown, but it can be added anywhere. Also, we changed the label of this attribute from “show/hidenavtab” to make sounds more meaningful as show:
Now add, the attributes you created earlier to your Navigation Options tab. Like above, we renamed the labels of the attributes to make them sound more meaningful:
Now we need to add the JavaScipt to control the objects we have added. First, go into Form Properties and enter the following JavaScript into the OnLoad & OnSave events ( You will notice that this script first checks for the attribute to Show/Hide the Navigation Options Tab itself, then checks each of the options):
//Hide Or Show Display Options Tab. Note: the tab number is dependent on tab you wish to hide
if (crmForm.all.new_showhidenavtab.DataValue == false)
{
//hide the second tab
crmForm.all.tab5Tab.style.display = "none";
}
else {
//show the second tab
crmForm.all.tab5Tab.style.display = "";
}
//Hide or Show Left Navigation Items
if (crmForm.all.new_moreaddressesnavoption.DataValue == false)
{
//hide the second tab
document.getElementById("navAddresses").style.display = "none";
}
else {
//show the second tab
document.getElementById("navAddresses").style.display = "";
}
if (crmForm.all.new_activitiesnavoption.DataValue == false)
{
//hide the second tab
document.getElementById("navActivities").style.display = "none";
}
else {
//show the second tab
document.getElementById("navActivities").style.display = "";
}
if (crmForm.all.new_historynavoption.DataValue == false)
{
//hide the second tab
document.getElementById("navActivityHistory").style.display = "none";
}
else {
//show the second tab
document.getElementById("navActivityHistory").style.display = "";
}
if (crmForm.all.new_subaccountsnavoption.DataValue == false)
{
//hide the second tab
document.getElementById("navSubAct").style.display = "none";
}
else {
//show the second tab
document.getElementById("navSubAct").style.display = "";
}
if (crmForm.all.new_contactsnavoption.DataValue == false)
{
//hide the second tab
document.getElementById("navContacts").style.display = "none";
}
else {
//show the second tab
document.getElementById("navContacts").style.display = "";
}
if (crmForm.all.new_relationshipsnavoption.DataValue == false)
{
//hide the second tab
document.getElementById("navRelationships").style.display = "none";
}
else {
//show the second tab
document.getElementById("navRelationships").style.display = "";
}
if (crmForm.all.new_workflowsnavoption.DataValue == false)
{
//hide the second tab
document.getElementById("navAsyncOperations").style.display = "none";
}
else {
//show the second tab
document.getElementById("navAsyncOperations").style.display = "";
}
2. At this stage, you will be able to hide the various navigation menu options as you have selected, either by saving or reloading the form. However, if like me, you like things a little smoother for your end user then you need to place each element of the JavaScript into the OnChange event for each of the Attributes as shown below:
· Show/hidenavtab
//Hide Or Show Display Options Tab. Note: the tab number is dependent on tab you wish to hide
if (crmForm.all.new_showhidenavtab.DataValue == false)
{
//hide the second tab
crmForm.all.tab5Tab.style.display = "none";
}
else {
//show the second tab
crmForm.all.tab5Tab.style.display = "";
}
· Moreaddressesnavoption
if (crmForm.all.new_moreaddressesnavoption.DataValue == false)
{
//hide the second tab
document.getElementById("navAddresses").style.display = "none";
}
else {
//show the second tab
document.getElementById("navAddresses").style.display = "";
}
· Activitiesnavoption
if (crmForm.all.new_activitiesnavoption.DataValue == false)
{
//hide the second tab
document.getElementById("navActivities").style.display = "none";
}
else {
//show the second tab
document.getElementById("navActivities").style.display = "";
}
· Historynavoption
if (crmForm.all.new_historynavoption.DataValue == false)
{
//hide the second tab
document.getElementById("navActivityHistory").style.display = "none";
}
else {
//show the second tab
document.getElementById("navActivityHistory").style.display = "";
}
· Sub-Accountsnavoption
if (crmForm.all.new_subaccountsnavoption.DataValue == false)
{
//hide the second tab
document.getElementById("navSubAct").style.display = "none";
}
else {
//show the second tab
document.getElementById("navSubAct").style.display = "";
}
· Contactsnavoption
if (crmForm.all.new_contactsnavoption.DataValue == false)
{
//hide the second tab
document.getElementById("navContacts").style.display = "none";
}
else {
//show the second tab
document.getElementById("navContacts").style.display = "";
}
· Relationshipsnavoption
if (crmForm.all.new_relationshipsnavoption.DataValue == false)
{
//hide the second tab
document.getElementById("navRelationships").style.display = "none";
}
else {
//show the second tab
document.getElementById("navRelationships").style.display = "";
}
· Workflowsnavoption
if (crmForm.all.new_workflowsnavoption.DataValue == false)
{
//hide the second tab
document.getElementById("navAsyncOperations").style.display = "none";
}
else {
//show the second tab
document.getElementById("navAsyncOperations").style.display = "";
}
Enjoy!
