Edición de «JQuery UI en Kumbiaphp Spirit beta2»
De KumbiaPHP Framework Wiki
Advertencia: no has iniciado sesión. Tu dirección IP se hará pública si haces cualquier edición. Si inicias sesión o creas una cuenta, tus ediciones se atribuirán a tu nombre de usuario, además de otros beneficios.
Puedes deshacer la edición. Antes de deshacer la edición, comprueba la siguiente comparación para verificar que realmente es lo que quieres hacer, y entonces guarda los cambios para así efectuar la reversión.
| Revisión actual | Tu texto | ||
| Línea 1: | Línea 1: | ||
| + | Vamos a crear un helper 'Calendar' que se pueda utilizar en cualquier vista de nuestra aplicación. [http://jqueryui.com/demos/datepicker/ ejemplo] | ||
| + | Vamos a empezar a ver como se utiliza. | ||
| + | |||
| + | 1° en la vista solo llamamos el helpers y se utiliza de esta forma. | ||
| + | |||
| + | <source lang="php"> | ||
| + | <?php | ||
| + | View::helpers('calendar'); | ||
| + | echo Calendar::text('fecha'); | ||
| + | ?> | ||
| + | </source> | ||
| + | |||
| + | |||
| + | ahora como ven es sumamente sencillo de utilizarlo, ahora empezamos a la construcción del helpers. | ||
| + | |||
| + | descargamos el [http://jqueryui.com/download jquery-ui-1.7.2.custom.zip] | ||
| + | descomprimimos y copiamos los siguientes archivos. | ||
| + | creamos la carpeta jquery en css y javascript | ||
| + | |||
| + | |||
| + | '''development-bundle/themes -> app/public/css/jquery/''' | ||
| + | |||
| + | '''development-bundle/ui -> app/public/javascript/jquery/''' | ||
| + | |||
| + | |||
| + | |||
| + | Helper. | ||
| + | |||
| + | Creamos el archivo en: app/extensions/helpers/calendar.php | ||
| + | <source lang="php"> | ||
| + | <?php | ||
| + | class Calendar{ | ||
| + | public static function text($field, $attrs = NULL, $value = NULL){ | ||
| + | static $i = false; | ||
| + | $code = ''; | ||
| + | if($i == false){ | ||
| + | $i = true; | ||
| + | $code = Tag::css('jquery/themes/ui-lightness/ui.all'); | ||
| + | $code .= Tag::js('jquery/ui/ui.core'); | ||
| + | $code .= Tag::js('jquery/ui/ui.datepicker'); | ||
| + | } | ||
| + | $code .= Form::text($field, $attrs, $value); | ||
| + | $field = str_replace('.', '_', $field); | ||
| + | $code .= "<script type=\"text/javascript\"> | ||
| + | $(function() { | ||
| + | $(\"#" . $field . "\").datepicker({ | ||
| + | altFormat: 'd/m/yy', | ||
| + | autoSize: true, | ||
| + | dayNames: ['Domingo', 'Lunes', 'Martes', 'Miercoles', 'Jueves', 'Viernes', 'Sábado'], | ||
| + | dayNamesMin: ['Dom', 'Lu', 'Ma', 'Mi', 'Je', 'Vi', 'Sa'], | ||
| + | firstDay: 1, | ||
| + | monthNames: ['Enero','Febrero','Marzo','Abril','Mayo','Junio','Julio','Agosto','Septiembre','Octubre','Noviembre','Diciembre'], | ||
| + | monthNamesShort: ['Enero','Febrero','Marzo','Abril','Mayo','Junio','Julio','Agosto','Septiembre','Octubre','Noviembre','Diciembre'], | ||
| + | dateFormat: 'dd/mm/yy', | ||
| + | changeMonth: true, | ||
| + | changeYear: true}); | ||
| + | }); | ||
| + | </script>"; | ||
| + | return $code; | ||
| + | } | ||
| + | } | ||
| + | ?> | ||
| + | </source> | ||
| + | |||
| + | |||
| + | |||
| + | no olvidar que deben tener habilitado en su proyecto el Jquery | ||
| + | |||
| + | |||
| + | [[Categoría:Tutoriales KumbiaPHP]] | ||
| + | [[Categoría:Tutoriales KumbiaPHP Beta2]] | ||
