jQuery en SageCRM - AutoComplete

En un post anterior empezamos a hablar de jQuery dentro de SageCRM y de las posibilidades y potencia que jQuery nos da. Una de las posibilidades que tenemos con jQuery es el uso de plugins ya creados. En este post hablaremos de cómo implementar un plugin de jQuery en SageCRM, en concreto el plugin de autocomplete.

En SageCRM existen varios tipos de campos de selección (Desplegable Simple, Desplegable MultiSelección o incluso existe la posibilidad de crear un campo de búsqueda avanzada sobre una entidad). Aun así, muchas veces nos encontramos con la necesidad de querer un campo desplegable que se auto-rellene según los valores que vamos introduciendo. 

Gracias a el plugin jQuery de autocomplete esto es posible como muestro a continuación.

jQuery en SageCRM - Eventos

Ya hemos visto que en SageCRM podemos utilizar jQuery. 

En este post voy a mostrar cómo se implementan  los métodos jQuery de los eventos de ratón y eventos de teclado.
 

Para ello realizaré algunos ejemplos que nos pueden ser de utilidad en nuestro día a día, en implementaciones de SageCRM:

1.     Mostrar Tooltip al entrar en un campo (mouseenter y mouseleave)
2.     Restringir la longitud de un campo, que esté comprendida entre 3 y 6 (focusout)
3.     Modificar la etiqueta de un campo al presionar una tecla dentro del campo (keypress)
4.     Animación de una etiqueta al clickar en el campo (click, fadein, fadeout)

jQuery en SageCRM

SageCRM es una herramienta que nos permite varios tipos de personalización, tanto a nivel de bloques del propio CRM, como con ASP Clásico o con dlls en .NET.

Además, como SageCRM es una aplicación Web, nos permite mediante JavaScript agregar funcionalidades directamente sobre el navegador (client-side). 

La novedad la encontramos a partir de la versión SageCRM 7.1 SP2, ya que incorpora las librerías de jQuery. Esto nos permite obtener toda la potencialidad de jQuery dentro de SageCRM sin tener que referenciar a su librería.

Esta librería la podemos encontrar dentro de la carpeta de instalación “CRM\WWWRoot\jQuery”.

Y si miramos el código fuente de la página principal de SageCRM, veremos que el propio SageCRM ya referencia estas librerías.

<script type="text/javascript" src="/CRM/jQuery/jquery-1.7.1.min.js"></script>

<script type="text/javascript" src="/CRM/jQuery/jquery-ui-1.8.16.custom.min.js"></script>

<script type="text/javascript" src="/CRM/jQuery/crmPopup.js"></script>

jqGrid - Funcionalidades - Editar (II)

En el post anteriores vimos cómo implementar “jqGrid”,   y algunas funcionalidades como ordenación, paginación, resize…

En esta entrada veremos:

·        Editar un registro en otra pantalla (dobleclick en la fila correspondiente)

·        Editar un registro desde la misma fila de la lista

·        Propiedades de Edición (link)

o   Tipos de campos (desplegables, texto, password , imagen …)

o   Atributos del campo (tamaño, longitud máxima, valores …)

o   Reglas de validación (requerido,  es un email, es un número,   es una fecha…)

o   Reglas de Validación personalizadas

jqGrid - Mas funcionalidades (I)

En el post anterior de “jqGrid” vimos cómo se podía implementar jqGrid en un desarrollo en ASP.NET MVC.

En las siguientes entradas, iré mostrando algunas de las funcionalidades y pequeños trucos y consejos.

En esta entrada veremos:

• Cómo modificar el tamaño del Grid, según el tamaño de nuestro navegador (Resize)
• Definir un tamaño mínimo de alto de nuestro Grid (height)
• Ordenación de las columnas (Sorted)
• Paginación

 

SageCRM – Campos Teléfono (II)

Después de comentar en la entrada “SageCRM - Campos Teléfono (I)” que mediante “javascript” se podían manipular campos “especiales”  (como son los teléfonos y los emails), se me ocurrió mostrar mediante la misma “técnica” y “tecnología”, como se pueden formatear los teléfonos para que siempre se entren y se visualicen de la misma manera. 

En este ejemplo, mostraré los teléfonos separados de 3 en 3, como muestro a continuación:

666 666 666