Sometimes we need to flag an account to make it obvious to the user that some action needs to take place. This recipe will show you two ways to do that. First off, we will put a different border color around the form. Secondly, we will add a colored title to the form, including a message to the user.
For the purpose of this exercise, we can reuse an existing solution. If none exists, create one. Make sure that you have at least the system customizer permission.
Open the solution and perform the following tasks:
- Add the Account entity to your solution if not already added.
- If asked to add related entities, click on Yes.
- Open the main Account form for editing.
- Add a new text field named
new_opencaseswith a label ofOpen Cases. Place the field on the form. - Save and Publish the form.
- Add the jQuery resource as described in previous recipes.
- Add a new web resource of type JScript. Name it
new_JSAccount. - Add the following script to your resource:
function ChangeBorderColor() { var _cases; try { _cases = parseInt(Xrm.Page.getAttribute("new_opencases").getValue()); } catch(err) { _cases = 9999; } if(_cases < 10) { // set border green $(".ms-crm-Form-Page-Main-cell").css("background-color","#00FF00"); } elseif(_cases < 20 && _cases >= 10) { // set border yellow $(".ms-crm-Form-Page-Main-cell").css("background-color","#FFFF00"); } else { // set border red $(".ms-crm-Form-Page-Main-cell").css("background-color","#FF0000"); } } - Associate the script to the form's
OnLoadand thenew_opencasesfield'sOnChangeevents. - Save and Publish the solution.
- Test your customization by loading an account. Modify the value of open cases in the field.
Note
In Chapter 9, Extending CRM Using Community JavaScript Libraries, we will demonstrate how to populate the Open Cases field automatically, taking advantage of external libraries.
Based on the value stored in our Open Cases field, we determine specific thresholds on number of open cases per account. This way we flag an account status to the user by providing a different color to the form border. In this example we are taking advantage of the jQuery library to select the form border, and to set the background-colour CSS property.
The following chapter will delve deeper into using the jQuery library for various form element selections, as well as other nifty tricks.
- Additional details on the jQuery library can be found in Chapter 8, Working with Ribbon Elements, as well as on the jQuery page, at http://jquery.com/.The documentation is located at http://docs.jquery.com/.