DynamicForm 1.8: añadiendo estilos a los formularios

El día de hoy vamos a añadir nuevas funcionalidades para dar diseño a nuestros formularios. Esto es algo que CRM 2011 no tiene de forma estándar pero que puede ser muy útil para guiar a los usuarios en los campos de los formularios, o para resaltar algunos en particular.

La idea es poder modificar los colores de fondo de la letra de los campos de CRM:

Formulario: Cuenta
Evento: OnLoad(), OnChange(), OnSave()

Atributos: (address2_line1, address2_line2, address2_line3 y description).
Funcionalidad: Se han modificado por el XML los colores de fondo de todos esos campos, y los colores de las letras a 2 de ellos.

Todo este ejemplo estará como siempre disponible en Codeplex:

http://elblogdedynamicscrm.codeplex.com/documentation

En el XML, he añadido unas acciones nuevas:

Los tipos de acciones nuevos que he creado son:

• backgroundcolor



• fontcolor

Ambos dos reciben como parámetros los nombres de los atributos (attributename) y el color a asignar (color).

He tenido que mejorar la función de acciones añadiendo nuevos métodos:

function Actions()
{
 var nodePath = "//Root/actions/action";
   var nodelist = doc.selectNodes(nodePath);
 //Actions
  LoadXmlWebResource("new_new_test_xml");
  for (var i = 0; i < nodelist.length; i++) 
   {
  var attributes=nodelist(i).attributes;
  var type= attributes.getNamedItem("type").nodeValue;
  
  switch (type)
  {
     case "concat":
        var destattribute= attributes.getNamedItem("destattribute").nodeValue;
     var attributestoconcat= attributes.getNamedItem("attributestoconcat").nodeValue;
     var stringseparator= attributes.getNamedItem("stringseparator").nodeValue;
     Concat(destattribute,attributestoconcat,stringseparator);
     break;
     case "backgroundcolor":
        var attributename= attributes.getNamedItem("attributename").nodeValue;
     var color= attributes.getNamedItem("color").nodeValue;
     setBackgroundColor(attributename,color);
     break;
     case "fontcolor":
        var attributename= attributes.getNamedItem("attributename").nodeValue;
     var color= attributes.getNamedItem("color").nodeValue;
     setFontColor(attributename,color);
     break;
     }
   }
}

Y para la gestión de los colores en los atributos he añadido dos funciones nuevas:

function setFontColor(attributename,color)
{
 document.getElementById(attributename).style.color = color;
}
function setBackgroundColor(attributename,color)
{
 document.getElementById(attributename).style.backgroundColor = color;
}

El ejemplo y la solución completa funcionando la he dejado como siempre en CodePlex.

Miren como quedaría el formulario con este ejemplo: