Tuesday, February 23, 2010

Dynamic tabs in a CRM form

This post doesn't cover any new ground. This topic has been covered in other blog posts. But I'm tired of digging up these other sites as I can't remember anything. The goal of this post is to explain how to toggle the display of a tab on a CRM form. We need to accomplish the following:

  • Create function to toggle tag
  • Call function when the form is loaded
  • Call function when element is clicked on

Let's create the function (onload):

/*Create function to hide tab*/
crmForm.Neudesic_ToggleLawfirmTab = function() {

/*check the value of the checkbox*/
var value = crmForm.all.neu_lawfirm.DataValue;
if(!value) {
crmForm.all.tab2Tab.style.display = "none";
} else {
crmForm.all.tab2Tab.style.display = "block";
}
}

Now let's take care of the last two issues:


if(crmForm.FormType == 1 || crmForm.FormType == 2) {
/*make sure the proper tabs are displayed*/
crmForm.Neudesic_ToggleLawfirmTab();

/*attach custom function to new_lawfirm element.
The CRM onchange event doesn't fire until the checkbox element
losses focus. I don't like this. So let's attach the event*/
var element =
document.getElementById("neu_lawfirm")
element.attachEvent("onclick", crmForm.Neudesic_ToggleLawfirmTab);
}

There you go! A couple discussion points. I don't like using the onchange event handler that CRM exposes for checkboxes as it doesn't fire until the element looses focus. So I use attachEvent to get the function to fire. Note that you can also use element.onclick. However this will override any other JavaScript functions that are attached to the element in question. Not really the best approach; especially when working with other developers. Also note that the toggle function is a child of the crmForm object. This allows for the function to be called in a onchange event from another CRM form onchange/onsave event. Defining as a free standing function will cause scope to be lost in another onchange/onsave event.

Keep in mind that in CRM 5.0 form tabs are going away. So this code will not work; but that doesn't matter now does it? Your technical; act like it. Solve the problem when it appears and know that it's coming. In the meanwhile you customers/users now have one more reason to love you...

Happy coding!

No comments:

Post a Comment