Italiano
Română
РусскийjQuery UI Datepicker no funciona
Quiero agregar un datepicker en una página personalizada pero no funciona. La versión de WP es 3.2.1. Estas son las cadenas de inicialización que usé en el código de WP:
wp_enqueue_script('jquery');
wp_enqueue_script('jquery-ui-core');
wp_enqueue_script('jquery-ui-datepicker', get_bloginfo('template_url') . '/js/jquery-ui-datepicker.min.js', array('jquery','jquery-ui-core'));
wp_enqueue_style('jquery.ui.theme', get_bloginfo('template_url') . '/js/smoothness/jquery-ui-1.8.16.custom.css');
Estos enqueues generan este código:
<script type='text/javascript' src='http://www.xxxxxxxx.it/wp-includes/js/jquery/jquery.js?ver=1.6.1'></script>
<script type='text/javascript' src='http://www.xxxxxxxx.it/wp-includes/js/jquery/ui.core.js?ver=1.8.12'></script>
<script type='text/javascript' src='http://www.xxxxxxxx.it/wp-content/themes/greyzed/js/jquery-ui-datepicker.min.js?ver=3.2.1'></script>
<link rel='stylesheet' id='jquery.ui.theme-css' href='http://www.xxxxxxxx.it/wp-content/themes/greyzed/js/smoothness/jquery-ui-1.8.16.custom.css?ver=3.2.1' type='text/css' media='all' />
En el body de la página, uso este código:
<script type="text/javascript">
jQuery('#datepicker').datepicker({
dateFormat : 'yy-mm-dd'
});
</script>
<div class="row"><label for="day">Fecha</label><input type="text" id="datepicker" name="day" class="text" /></div>
El datepicker no funciona. No sé cómo depurar este problema. No hace nada, como si jQuery ni siquiera estuviera presente.
ACTUALIZACIÓN:
Con su ayuda logré depurar el código. Coloqué el script después del div y lo cambié a:
<script type="text/javascript">
jQuery(document).ready(function() {
jQuery('#datepicker').datepicker({
dateFormat : 'yy-mm-dd'
});
});
</script>
Este código me da un error al llamar al método datepicker, el error indica:
Uncaught TypeError: Object [object Object] has no method 'datepicker'
Si escribo jQuery('#datepicker') en la consola de javascript, obtengo esto:
[<input type="text" id="datepicker" name="day" class="text">]
No obtengo otros errores excepto ese, todas las referencias a jQuery parecen funcionar bien.
ACTUALIZACIÓN 2:
¡Finalmente lo hice funcionar! Tuve que colocar 'wp_print_scripts' en lugar de 'init', y tuve que reposicionar algo de código de inicialización de otro plugin que estaba en conflicto. El único problema restante son los temas... si uso el tema básico dentro de googlecode, funciona. Si uso otros temas (integrados en wp o enlazados con wp_enqueque_style) el tema no se cargará... si reviso el HTML generado, no hay señal de la línea que debería cargar el tema de jQuery.
Seguí tus consejos e hice algunos pasos: ahora tengo el error que está impidiendo que mi código funcione. Dice: Uncaught TypeError: Object [object Object] has no method 'datepicker' en la línea jQuery('#datepicker').datepicker
Terix
Si ese es el caso, entonces el script datepicker no se está incluyendo correctamente, o es el script incorrecto. Actualizaré mi publicación con código que funcione.
v0idless
Esto me está volviendo loco... ¡sigo teniendo el mismo error! Cambié el código según tu sugerencia, cuando escribo jQuery('#datepicker') obtengo el div como antes, pero sigo recibiendo exactamente el mismo error. Probé con un archivo HTML vacío, colocando el HTML de salida de los wp_enqueues, y con esta página de prueba funciona, así que hay algo dentro de WordPress que está interfiriendo con datepicker(), pero no tengo idea de cómo solucionar esto...
Terix
Entonces lo que haría es configurar tu tema a twentyeleven, y desactivar todos los demás plugins. Actívalos uno por uno hasta encontrar cuál está causando que el datepicker falle.
v0idless
¡Finalmente logré que funcione! Tuve que usar 'wp_print_scripts' en lugar de 'init', y además reubicar cierto código de inicialización de otro plugin que estaba causando conflicto. El único problema restante son los temas... si uso el tema básico de googlecode, funciona. Si uso otros temas (incrustados o enlazados con wp_enqueque_style) el tema no se carga.
Terix
Coloqué el script después del '<div>' pero no cambió nada. He hecho una página de prueba, HTML simple, con solo el HTML generado desde la página de WordPress, y aún no funciona. ¿Cómo puedo depurarlo?
Terix
Asegúrate de tener Firebug, Google Chrome, o usar Internet Explorer con las Herramientas para desarrolladores activadas (F12). Debes revisar la consola de errores y buscar errores de JavaScript. Siéntete libre de publicar un enlace y lo revisaremos.
Tom Auger
¿quieres decir poner el código jquery dentro de un archivo js y llamarlo?
Terix
@bueltge eso solo resolvería el problema si Terix lo llamara así: wp_enqueue_script( 'do-date', 'http://www.xxxxxxxx.it/wp-content/themes/greyzed/js/do_date.js' , array('jquery-ui-datepicker'), 1, true ) - el último 'true' es importante para que coloque el script en el footer, es decir, después de que se haya creado el div. Aún así, prefiero usar document.ready(), independientemente.
Tom Auger