jQuery datepicker sin entrada

Question

Tengo una aplicación web bastante compleja a la que me gustaría agregarle una IU de recolección de fechas.

El problema con el que me estoy encontrando es que no he podido deducir de los documentos cómo realmente tomar el control de cómo y cuándo aparece el marcador de fecha. No hay elementos de formulario implicados (y no, no voy a agregar un campo de formulario secreto), por lo que el enfoque simple listo para usar simplemente no funcionará.

Espero que alguien pueda proporcionar una pequeña guía sobre un patrón que me permita invocar el datepicker programáticamente. Creo que sé cómo utilizaría los eventos personalizados de datepicker para inicializarlo y posicionarlo, y para recuperar el valor elegido cuando el usuario lo descarta. Solo me cuesta crear una instancia de un marcador de fecha, ya que no lo estoy emparejando con un elemento.

Esto es lo que no es de trabajo:

function doThing(sCurrent, event) { // sCurrent is the current value; event is an event I'm using for positioning information only 
    var bIsDate = !isNaN((new Date(sCurrent)).getTime()); 

    jQuery.datepicker('dialog', 
     (bIsDate ? new Date(sOriginal) : new Date()), // date 
     function() { console.log('user picked a date'); }, // onSelect 
     null, // settings (i haz none) 
     event // position 
    ); 

} 

La razón es que "jQuery.datepicker" no es una función. (Estoy haciendo lo incorrecto.)

No estoy casado con el enfoque de 'diálogo' - fue mi mejor intento de invocar uno sin referencia a un elemento de formulario.

estoy usando jQuery 1.4.3 y 1.8.6 jQueryUI

Answer 1

He leído a través del código de selector de fecha, y parece que, como está escrito, el selector de fechas debe ser unido a una etiqueta de entrada, div, o el intervalo.

tanto, si su única objeción es que el uso de un elemento de formulario, luego adjuntar a un div o palmo es probablemente su mejor apuesta, y hay un ejemplo de cómo hacerlo aquí: https://stackoverflow.com/a/1112135

Si eres buscando otra forma de controlar el datepicker, entonces puede que tengas que extender el código datepicker para hacer lo que quieres que haga, y si vas por esa ruta, entonces recomiendo comenzar echando un vistazo al método privado _inlineDatepicker en el datepicker código, que es el método que asocia el selector de fecha a una etiqueta div o span.

Answer 2

tiene que definir Campo de entrada dinámicamente luego coloque el selector de fechas que su clase recién creada Sin campo no creo que por lo que funciona.

<input type="hidden" id="yourField" /> 

y utilizar

$("#yourField").datepicker({ 
     buttonImage: '../yourImage.png', 
     buttonImageOnly: true, 
     changeMonth: true, 
     changeYear: true, 
     showOn: 'both', 
    }); 

Answer 3

Desde la página del plugin: http://jqueryui.com/demos/datepicker/#inline

<script> 
    $(function() { 
     $("#datepicker").datepicker(); 
    }); 
</script> 


<div class="demo"> 
    Date: <div id="datepicker"></div> 
</div><!-- End demo --> 

visualización del selector de fechas incrustado en la página en lugar de en una superposición. Simplemente llame a .datepicker() en un div en lugar de una entrada.