Cómo usar sfWidgetFormJQueryDate de sfFormExtraPlugin?

sfFormExtraPlugin es un excelente plugin que mantienen los desarrolladores de Symfony con un montón de características adicionales que te ayudarán a construir formularios más completos.

¿Qué podemos encontrar en este plugin?

Són varias las utilidades que nos ofrece, desde la creación de campos captcha para evitar el spam hasta campos de texto autocompletables en función de lo que vayamos escribiendo. Aquí os dejo una lista con sus posibilidades:

  1. ReCaptcha widget y validador
  2. Editor HTML WYSIWYG para campos de texto
  3. Selector de fechas tipo calendario
  4. Selectores de idioma
  5. Widget de listas dobles
  6. Widget de autocompletado en campos de texto

¿Cómo instalar y usar sfWidgetFormJQueryDate?

sfWidgetFormJQueryDate nos creará un selector de fechas con unas configuraciones mínimas para facilitar la tarea de rellenar los campos date en nuestros formularios. En la siguiente imágen, puedes ver el resultado de su correcta implementación:

sfwidgetformjquerydate

A pesar de que este plugin está muy extendido, es muy poca la información que se puede encontrar sobre como instalarlo y usarlo correctamente. Espero que esta pequeña guía os sea de utilidad.

  1. Instalar el plugin:
    symfony plugin:install sfFormExtraPlugin
  2. Una vez instalado, también necesitaremos descargar las librerías jQuery UI de la web oficial.
  3. Ahora debemos configurar convenientemente nuestra aplicación para que use estas librerías javascript. Abre el zip descargado y mueve los archivos jquery-1.3.2.min.js y jquery-ui-1.7.2.custom.min.js a tu carpeta /path/to/project/web/js/Edita el archivo /path/to/project/apps/[app]/config/view.yml y añade esta información:
    javascripts:    [jquery-1.3.2.min.js, jquery-ui-1.7.2.custom.min.js]
  4. El siguiente paso será configurar los CSS de la librería jQuery UI. Añadimos  la siguiente información al archivo view.yml recién editado:
    stylesheets:    [main.css, ui-lightness/jquery-ui-1.7.2.custom.css]
  5. Configurar nuestro formulario para que utilice el widget:
    class myForm extends sfForm {
      public function configure()
      {
        $this->setWidgets(array(
          'from_date'    => new sfWidgetFormJQueryDate(array(
          'image'=> '/images/icons/calendar_view_month.gif',
          'format' => '%day%/%month%/%year%')
        ),
          //...other widgets
        ));
    
        $this->widgetSchema->setLabels(array(
      		'from_date'    => 'From Date',
                    //...other labels
        ));
      }
    }
  6. Por último, lo prepararemos para usar en el action:
      public function executeSearch(sfWebRequest $request){
        $this->form = new myForm();
        return sfView::SUCCESS;
      }

    y renderizaremos en la vista:

    ....
    echo $form['from_date']->renderLabel().":".$form['from_date'];
    ....

Vía | Symfonynerds.com

6 thoughts on “Cómo usar sfWidgetFormJQueryDate de sfFormExtraPlugin?

  1. Pingback: Tweets that mention Cómo usar sfWidgetFormJQueryDate de sfFormExtraPlugin? -- Topsy.com

  2. Como puedo hacer para reemplazar los tres combo box por un input text para la fecha y agregar este widget de jquery. porque no lo encuentro por ningun lado

  3. Seguí todos los pasos pero solo me mostró el widget de date normal… uso symfony 1.4 con propel. Ademas necesito implementar el autocompletar y el ReCaptcha podrías ayudarme???

  4. No encuentro por ningún lado como personalizar para que las semanas empiecen en lunes y cambiar los nombres de los meses, alguien sabe?

  5. Hola: como puedo hacer para que me lo muestre en español y en formato dia mes año porque cuando pongo
    ‘format’ => ‘%day%/%month%/%year%’
    me tira error gracias

Comments are closed.