ASP.NET DateTime Picker

Question

¿Hay algún buen control de selector de tiempo de fuente libre/abierta que vaya bien con el control de calendario de ASP.NET?

Answer 1

jQuery tiene la mejor datepicker en mi humilde opinión. Si bien no es específico de .Net todavía funciona de maravilla.

HTML:

<input type="text" value="9/23/2009" style="width: 100px;" readonly="readonly" name="Date" id="Date" class="hasDatepicker"/> 

en el elemento de cabeza:

<script src="../../Scripts/jquery-1.3.2.min.js" language="javascript" type="text/javascript"/> 
<script src="../../Scripts/jquery-ui-1.7.1.custom.min.js" type="text/javascript"/> 

simple como eso!

Answer 2

Puesto que es el único que he usado, sugeriría la CalendarExtender de http://www.ajaxcontroltoolkit.com/

Answer 3

Basic Date Picker Lite

Esta es la versión gratuita de su producto estrella, pero contiene una fecha y hora nativa selector de asp.net.

Answer 4

Pruebe bootstrap-datepicker si está utilizando bootstrap.

Answer 5

La respuesta a su pregunta es Sí, hay un buen control de selector de tiempo de fuente libre/abierta que va bien con el control de calendario de ASP.NET.

ASP.NET El control de calendario simplemente escribe una tabla html.

Si está utilizando HTML5 y DOT.NET Framework 4.5, puede usar el control ASP.NET TextBox y establecer la propiedad TextMode en "Fecha", o "Mes", o "Semana", o " Time "o" DateTimeLocal "o si es no utilizando Chrome o Firefox o Internet Explorer, entonces también puede establecer esta propiedad a" DateTime ".

A continuación, lea la propiedad Texto para obtener la fecha, o la hora, el mes o la semana como una cadena de TextBox.

Si está utilizando DOT.NET Framework 4.0 o una versión anterior, puede usar ya sea html5 input type = "date" o input type = "month" o input type = "week" o input type = "time" o tipo de entrada = "datetime-local" o si usted es no usando Chrome o Firefox o Internet Explorer, entonces también puede usar input type = "datetime".

Si necesita en el código del lado del servidor (escrito en C# o Visual Basic) la información que ingresa el usuario en el campo de fecha, puede intentar ejecutar este elemento en el servidor escribiendo dentro de la etiqueta de entrada runat="server"

También dale a este elemento una identificación, para que pueda acceder a él en el código del lado del servidor. Lea la propiedad Value para obtener la fecha de entrada, la hora, el mes o la semana como cadena. Si no puede ejecutar este elemento en el servidor, necesita un campo oculto además del tipo de entrada = "fecha" o "hora" o "mes" o "semana". En la función enviar (escrita en javascript) establezca el valor del campo oculto en el valor del tipo de entrada = "fecha", o "hora", o "mes", o "semana", y luego en el lado del servidor código, lea la propiedad Value de ese campo oculto como cadena también.

Seguro de que el elemento de campo oculto del html puede ejecutarse en el servidor.

Espero que ayude.

Answer 6

Existe una implementación sencilla y lista para usar: el HTML 5 input type="date" y los otros tipos de entrada relacionados con la fecha.

Bien, no se puede modificar el estilo de los controles y mucho doesn't work on every browser, pero aún puede ser una muy buena opción a largo plazo si todos los navegadores modernos lo admiten y no desean incluir bibliotecas pesadas que no funcionan Siempre funciona bien en dispositivos móviles.

Answer 7

Esta es una solución sin jquery.

Añadir calendario y cuadro de texto en el formulario Web -> Fuente de WebForm tiene esta:

<asp:Calendar ID="Calendar1" runat="server" OnSelectionChanged="DateChange"> 
</asp:Calendar> 
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox> 

Crear métodos de archivo de formulario Web cs:

protected void Page_Load(object sender, EventArgs e) 
    { 
     TextBox1.Text = DateTime.Today.ToShortDateString()+'.'; 
    } 

    protected void DateChange(object sender, EventArgs e) 
    { 
     TextBox1.Text = Calendar1.SelectedDate.ToShortDateString() + '.'; 
    } 

Método DateChange está conectado con el evento de calendario SelectionChanged. Se ve así: DatePicker Image