lunes, 30 de julio de 2012

DynamicForm 2.0: Convirtiendo un Lookup en RadioButton

Hoy vamos a mejorar el rendimiento en la introducción de datos de nuestros usuarios finales. Este rendimiento se verán mejorados teniendo en cuenta los campos de tipo Lookup (o de referencia). Inicialmente en un campo de este tipo, para introducir información, se necesita como mínimo un total de tres clicks. Empezamos con la versión anterior convirtiendo el Lookup en un combo, reduciendo los clicks a solo dos clicks.
Bien, hoy vamos a mejorarlo para que sea en un solo click. La idea es añadir la posibilidad de convertir un Lookup en un Radio button!
El resumen de la entrega de hoy:
Formulario: Cuenta
Evento: OnLoad()
Atributos: (new_paisid).
Funcionalidad: Al cargar el formulario, en un IFRAME se crea dinámicamente un desplegable con los posibles valores de un campo de lookup de Países. La idea es que el Lookup de país, se rellene mediante un listado de radio buttons.
Todo este ejemplo estará como siempre disponible en Codeplex:
http://elblogdedynamicscrm.codeplex.com/documentation
En el XML, he añadido una nueva acción:
   1: <action type="lookuptoradio" attributename="new_paisid" entityname="new_pais"
   2:  entityid="new_paisid" entityattributename="new_name" iframename="IFRAME_paisradio"/>

La nueva acción se llama “lookuptoradio” y como su nombre lo indica, convierte un lookup en un radio button. Los atributos son los siguientes (iguales al de la versión anterior de lookuptocombo):
  • attributename: nombre del campo de lookup en el formulario
  • entityname: nombre de la entidad a donde apunta el lookup
  • entityid: nombre del campo clave de la entidad
  • entityattributename: campo nombre de la entidad que será utilizado para enseñar los valores del desplegable.
  • iframename: nombre del iframe donde se incluirá el desplegable dinámicamente.
En la función LookuptoCombo, he realizado ciertas modificaciones, para que funcione tanto como combo como con radiobuttons. El funcionamiento es muy similar:

   1: function LookupToCombo(attributename,entityname,iframename,entityid,entityattributename,
   2:  type)
   3: {
   4:     var result=RetrieveEntitiesByFilter (entityname, "statecode", "Active", entityid+","+
   5:         entityattributename, false, "");
   6:     var i=0;
   7:     var svalue="";
   8:     var objvalue=getValue(attributename);
   9:     if (!objvalue)
  10:     {
  11:         svalue="";
  12:     }
  13:     else
  14:     {
  15:         svalue=objvalue[i].id;
  16:     }
  17:     var HTMLselect="";
  18:     
  19:     if (type=="lookuptocombo")
  20:     {
  21:        HTMLselect="<select style='font-size:11Px;font-family:Segoe UI, Tahoma, Arial;' ;
  22:         onchange='var select_list_selected_index = this.selectedIndex;var text = 

  23:         this.options[select_list_selected_index].text;var value = this.value;

  24:         parent.setLookupValue(value,text,document.all.entityname.value,

  25:         document.all.attributename.value);'>"

  26:        HTMLselect+="<option value=''></option>";
  27:     }
  28:     else
  29:     {
  30:        HTMLselect="<form style='font-size:11Px;font-family:Segoe UI, Tahoma, Arial;'>";
  31:     }
  32:     for (i=0;i<result.recordCount;i++)
  33:     {
  34:         var selected="";
  35:         var name=eval("result[i]."+entityattributename);
  36:         var id=eval("result[i]."+entityid);
  37:         if (svalue==id)
  38:         {
  39:             if (type=="lookuptocombo")
  40:             {
  41:                 selected="SELECTED";
  42:             }
  43:             else
  44:             {
  45:                 selected="CHECKED";
  46:             }
  47:         }
  48:         if (type=="lookuptocombo")
  49:         {
  50:            HTMLselect+="<option "+selected+" value='"+id+"'>"+name+"</option>";
  51:         }
  52:         else
  53:         {
  54:            var js="onclick='parent.setLookupValue(this.value,this.nombre,;
  55:                 document.all.entityname.value,document.all.attributename.value);'"

  56:            HTMLselect+="<input "+js+" type='radio' name='opt' nombre='"+name+"' +id+"' "+selected+" /> "+name+"<br />";
  57:                 value='"

  58:         }
  59:     }
  60:     if (type=="lookuptocombo")
  61:     {
  62:        HTMLselect+="</select>";
  63:     }
  64:     else
  65:     {
  66:         HTMLselect+="</form> ";
  67:     }
  68:     HTMLselect+="<input type='hidden' id='entityname' name='entityname' +entityname+"'/><input type='hidden' id='attributename' +attributename+"'/>";
  69:         value='"

  70:         name='attributename' value='"

  71:     var myIframe=document.getElementById(iframename);
  72:     myIframe.contentWindow.document.body.innerHTML = HTMLselect;
  73:     myIframe.contentWindow.document.body.style.margin="0px;";
  74: }


Básicamente, he añadido un nuevo parámetro (type) que me dice de que tipo es, y dependiendo del mismo, voy generando un combo o un radiobutton.

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

Miren como se ve el formulario funcionando con el combo y los radiobuttons:

image


Un saludo!

No hay comentarios:

Publicar un comentario