Cuando definimos un formulario en Django aparte de que le decimos que modelo va a tomar y los campos que debe mostrar, también podemos indicarle que comportamiento y que tipo de HTML va a definir cada campo, sabemos que por ejemplo un CharField nos debe mostrar un input tipo text pero qué tal si queremos que ese input tipo text venga ya con una clase para que tenga un comportamiento por CSS o que ese elemento sea sustituido por otro elemento.
Para lograr esto tenemos los widgets y los podemos definir al momento de hacer la clase de formulario en nuestra aplicación.
Comportamiento del HTML
Como mencionamos, Django muestra los campos de formulario en código HTML y para ello dependiendo del tipo de campo definido será el elemento HTML que se mostrará al momento de generar el formulario, si queremos funcionalidades adicionales en nuestros campos Django nos ofrece los widgets para poder incorporar dichas funcionalidades extra.
Widgets Personalizados
Otro aspecto que podemos tener en cuenta es que si no nos es suficiente con los widgets de Django, al igual que sucede con los tipos de campos, podemos personalizarlos, de forma que podamos lograr comportamientos específicos que se ajusten a nuestra aplicación.
Por ejemplo podemos crear un tipo de widget que se integre con un calendario Javascript que hayamos desarrollado o que sea solicitado en específico para nuestro formulario.
Aplicación práctica
Veamos a continuación un ejemplo donde vamos a generar un formulario utilizando los widgets para definir algunos aspectos de los campos, este ejercicio lo vamos a realizar en la consola interactiva de Python:
Vemos en la imagen entonces que en la consola hemos definido una clase de formulario y dentro hemos colocado dos campos, así evitamos instanciar desde un modelo, el primero campo cod le decimos que es un campo IntegerField, con ello será validado a solo números al momento del submit, pero lo que nos interesa es el segundo campo, este le decimos que tiene un widget y que es un forms.Textarea, si nos fijamos lo hemos definido como un CharField, esto nos indica que en el HTML debería ser un input text sin embargo con el widget lo hemos cambiado, al ver el HTML resultante tenemos que es un textarea de HTML.
Si queremos definir un campo con un widget personalizado podemos declarar una clase con un tipo de input y este luego colocarlo dentro del formulario, veamos este código para que entendamos:
Luego en el formulario lo llamamos:
Como pudimos ver es bastante sencillo agregar nuevos tipos de widgets a nuestra aplicación.
Para lograr esto tenemos los widgets y los podemos definir al momento de hacer la clase de formulario en nuestra aplicación.
Comportamiento del HTML
Como mencionamos, Django muestra los campos de formulario en código HTML y para ello dependiendo del tipo de campo definido será el elemento HTML que se mostrará al momento de generar el formulario, si queremos funcionalidades adicionales en nuestros campos Django nos ofrece los widgets para poder incorporar dichas funcionalidades extra.
¿Cómo se logra?
Esto se logra debido a que cada campo definido en Django en un formulario posee un atributo widget y por lo tanto al momento de instanciarlo podemos darle valor a dicho atributo y lograr que funcione de acuerdo a la forma que lo deseemos.
Widgets Personalizados
Otro aspecto que podemos tener en cuenta es que si no nos es suficiente con los widgets de Django, al igual que sucede con los tipos de campos, podemos personalizarlos, de forma que podamos lograr comportamientos específicos que se ajusten a nuestra aplicación.
Por ejemplo podemos crear un tipo de widget que se integre con un calendario Javascript que hayamos desarrollado o que sea solicitado en específico para nuestro formulario.
Herencia
Para que un widget personalizado obtenga las funcionalidades básicas esperadas debe heredar de Django.forms.widgets.Widget sin embargo esto no es obligatorio, una vez que se hereda de esta clase podemos ir sobrescribiendo los métodos necesarios para obtener nuestra funcionalidad.
Aplicación práctica
Veamos a continuación un ejemplo donde vamos a generar un formulario utilizando los widgets para definir algunos aspectos de los campos, este ejercicio lo vamos a realizar en la consola interactiva de Python:
Vemos en la imagen entonces que en la consola hemos definido una clase de formulario y dentro hemos colocado dos campos, así evitamos instanciar desde un modelo, el primero campo cod le decimos que es un campo IntegerField, con ello será validado a solo números al momento del submit, pero lo que nos interesa es el segundo campo, este le decimos que tiene un widget y que es un forms.Textarea, si nos fijamos lo hemos definido como un CharField, esto nos indica que en el HTML debería ser un input text sin embargo con el widget lo hemos cambiado, al ver el HTML resultante tenemos que es un textarea de HTML.
Si queremos definir un campo con un widget personalizado podemos declarar una clase con un tipo de input y este luego colocarlo dentro del formulario, veamos este código para que entendamos:
class PorcentajeInput(forms.TextInput): def render(self, name, value, attrs=None): return '%s %%' % super(PorcentajeInput, self).render(name, value, attrs)
Luego en el formulario lo llamamos:
descuento = forms.IntegerField(widget=PorcentajeInput())
Como pudimos ver es bastante sencillo agregar nuevos tipos de widgets a nuestra aplicación.
