Something that makes any web application a great one IMO is making it behave like a windows app as much as possible. Making a web application behave the way you'd expect a windows app to behave is what will get you a huge buy-in from end-users. The MSCRM client is no different. I think it is important to take every opportunity to make things happen the same way you would in a windows application.

For example, why show all fields on a form, even when some are only relevant when certain conditions exist? Hide them if the user doesn't need them and show them when your condition is satisfied. Let's say you have a picklist and a textbox. The picklist (schema name: new_category) represents a type of category for the entity. If the user selects “Non-Billable” from the list you want them to have the ability to enter a reason (schema name: new_nonbillreason) why the category is non-billable. There's no need to cause confusion for the user by showing them the new_nonbillreason field, unless they've selected “Non-Billable” as the category, right? Easy enough task. You'll need to add code for the form's OnLoad event, as well as for the OnChange event for the new_category picklist field.

The best way to hide a field, is not to hide the field itself, but hide the td cells that they are in. The fields label is just text, not in a label or span or something you can get to, so hiding the field only will leave the caption visible. However, you can hide the td cell that the caption is in. Each field will have two td cells. One that the caption is in, and another that the field's control is in. The caption's td cell will be named the same as the schema name, but will have a “_c” at the end. The field itself will be in a td cell that is named the same as the schema name but ending with a “_d”. So, for our example, we'll need to show/hide two td cells, one named “new_nonbillreason_c” and “new_nonbillreason_d”. Make sense? Here's the code for the OnChange event for the “new_category” picklist field.

// get the text value of the category field 
var categorytype;
categorytype = crmForm.new_category.SelectedText;

if (categorytype != 'Non-Billable')
{
    // hide the nonbillreason field & caption cells 
    crmForm.all.new_nonbillreason_c.style.display = 'none';
    crmForm.all.new_nonbillreason_d.style.display = 'none';
}
else
{
    // show the nonbillreason field & caption cells 
    crmForm.all.new_nonbillreason_c.style.display = '';
    crmForm.all.new_nonbillreason_d.style.display = '';
}

A few things to note here. Remember that we are hiding td cells. So when we set the “display” style attribute to none we will see that the table will collapse where the field is if it is the only field on that row. If you wanted to have everything stay in the same spot (and not have the collapsing effect for the table) then you can change the code so that you toggle the “visibility” style attribute instead. Then, technically the td cells are still there, just not showing. The code would look like this:

if (condition)
{
    // hide the nonbillreason field & caption cells 
    crmForm.all.new_nonbillreason_c.style.visibility = 'hidden';
    crmForm.all.new_nonbillreason_d.style.visibility = 'hidden';
}
else
{
    // show the nonbillreason field & caption cells 
    crmForm.all.new_nonbillreason_c.style.visibility = 'visible';
    crmForm.all.new_nonbillreason_d.style.visibility = 'visible';
}

That's it. Don't forget you'll want to add the same code for the form's OnLoad event. Unless the category fields default value is “Non-Billable“ you'll want that hidden from the start. However, if it's an update then you should first check the value and then set the nonbillreason's visibility based on the current value of category.

var CREATETYPE = 1;                
var UPDATETYPE = 2;

switch (crmForm.FormType)
{
    case CREATETYPE:
        // for creates, initialize the field to hidden
        crmForm.all.new_nonbillablereason_c.style.visibility = 'hidden';
        crmForm.all.new_nonbillablereason_d.style.visibility = 'hidden';
        break;

    case UPDATETYPE:
        // for updates, first check the value of category and conditionally hide
        var categorytype;
        categorytype = crmForm.new_category.SelectedText;
        
        if (categorytype != 'Non-Billable')
        {
            crmForm.all.new_nonbillablereason_c.style.visibility = 'hidden';
            crmForm.all.new_nonbillablereason_d.style.visibility = 'hidden';
        }
        break;
}

One thing to point out though, if the field you are hiding is “Business Required” then it will still be checked for a value when the user attempts to close the form - which means they won't be able to close the form since the field isn't visible for them to enter a value into. In these cases where the field must be required, you'll also need to toggle that at runtime as well. We'll look at that next time.