Publicidad

Usar el control calendario en ASP.NET


Por Alex el 24/06/2005 , Comentarios: 1

Comparte este artículo:        




El control calendario proporciona una forma rápida y sencilla de crear calendarios en las páginas web. A través de este control y con unas pocas líneas de código podemos realizar un calendario completo para representar, por ejemplo, una serie de eventos relacionados con un mes.


El control calendario muestra un calendario de un mes y permite seleccionar el mes siguiente o el anterior.

Por defecto muestra el mes actual pero podemos modificar esta funcionalidad

Imagen

Con este método Calendar1.SelectedDate podemos elegir el mes que queremos mostrar.

Calendar1.SelectedDate = Convert.ToDateTime("12/08/2005");

Una vez tenemos el control insertado en la página web vamos a ver cómo podemos modificarlo y personalizarlo. Lo primero que haremos es darle un poco más de color y cambiar su aspecto

Imagen

para ésto es necesario modificar las propiedades a través de la ventana de propiedades

Imagen

o a través de código HTML:

<TodayDayStyle ForeColor="Black" BackColor="#FF9900"></TodayDayStyle>
<SelectorStyle BackColor="#CCCCCC"></SelectorStyle>
<NextPrevStyle VerticalAlign="Bottom"></NextPrevStyle>
<DayHeaderStyle Font-Size="9pt" Font-Bold="True" BackColor="#CCCCCC"></DayHeaderStyle>
<SelectedDayStyle Font-Bold="True" ForeColor="White" BackColor="#FF9900"></SelectedDayStyle>
<TitleStyle Font-Bold="True" BorderColor="Black" BackColor="#999999"></TitleStyle>
<WeekendDayStyle BackColor="#DBE5EC"></WeekendDayStyle>
<OtherMonthDayStyle ForeColor="Gray"></OtherMonthDayStyle>



Imagen

También sustituimos las flechas de cambio de mes por el nombre abreviado del mes, cambiando la propiedad NexPrevFormat de CustomText, que es la que tiene por defecto, a ShortMonth.

Ahora tenemos el control calendario con un poco más de diseño y vamos a modificar los elementos del calendario para que cuando pasemos por un día se marque en otro color. Además enlazaremos unos determinados días con un link para que vaya a otra página simulando los días de un evento.

Nota: En el ejemplo, los días marcados como evento se extraen de un array pero fácilmente puede modificarse el código para que esos días puedan estar en una base de datos.

Modificar calendario en tiempo de ejecución.

Cuando el control calendario se renderiza y se va construyendo podemos modificar todos sus elemento creando un método. En modo de diseño añadiremos el método ParseCalendar al evento OnDayRender. El método ParseCalendar, es un método que nosotros creamos en el código:

Creamos el método para modificar los elementos del calendario, los días. En el parámetro e vienen definidos los días del calendario y cada vez que se muestra un día por pantalla pasa por esta función.

public void ParseCalendar(object sender, DayRenderEventArgs e) {

Definimos una variable que representara el dia actual.

string sdia = System.DateTime.Now.Day.ToString();

Definimos el color que tendran los dias cuando pase el raton por encima de ellos.

e.Cell.Attributes["onmouseover"] = "this.style.backgroundColor='pink';";

Si el dia es fin de semana lo pintamos de azul claro.

if (e.Day.IsWeekend) {
  e.Cell.Attributes["onmouseout"] =
    "this.style.backgroundColor='#DBE5EC';";
}

Si pasamos con el ratón por encima del día actual se pone de color rosa y luego hacemos que vuelva a tener el color del día actual.

if (e.Day.DayNumberText == sdia && e.Day.IsToday == true)
  e.Cell.Attributes["onmouseout"] =
   "this.style.backgroundColor='#ff9900';";

Creamos un enlace en los dias marcados como eventos que tenemos guardados en un array (DiasMarcados)

for (int i = 0; i < DiasMarcados.Length; i++) {
 string[] arrayFecha = e.Day.Date.ToString().Split(new char[] {' '});
 if (arrayFecha[0] == DiasMarcados[i]) {
  e.Cell.ToolTip = DiasMarcados[i];
  e.Cell.Text = "" + e.Day.DayNumberText + "";
 } }

En el ejemplo que acompaña el articulo esta el código completo.

Enlaces relacionadas:

Código fuente del artículo 

Saludos
Alex


Si te ha gustado el artículo compartelo en:        


Publicidad

También puede interesarte:

Limpiar datos de un combobox en winforms.

Limpiar datos de un combobox en winforms.

Por Alex, el 23/03/2010

Crear, copiar y borrar bases de datos SQL Server desde c#.

Crear, copiar y borrar bases de datos SQL Server desde c#.

Por Alex, el 07/03/2010

Escribir en un excel desde c#.

Escribir en un excel desde c#.

Por Alex, el 04/03/2010

Llenar un Repeater o DataList con un DataTable.

Llenar un Repeater o DataList con un DataTable.

Por Alex, el 29/12/2008

El evento SelectedIndexChanged no funciona

El evento SelectedIndexChanged no funciona

Por Alex, el 26/12/2008

Crear un DataSet vacío

Crear un DataSet vacío

Por Alex, el 26/12/2008


Añadir un comentarios:

Nombre:
Email: (no se publica el email)

avatar

Oscar Fiblas Aramayo 12/08/2018 06:30:07

¿Es posible implementar un calendario desplegable en Asp.Net tipo DateTimePicker de Windows Forms?




SIGUENOS EN

ARCHIVO

Publicidad

.