Sintaxis declarativa del control de servidor Web Calendar
Actualización: noviembre 2007
Muestra un calendario de un solo mes que permite al usuario seleccionar fechas y desplazarse al mes siguiente o al mes anterior.
<asp:Calendar
AccessKey="string"
BackColor="color name|#dddddd"
BorderColor="color name|#dddddd"
BorderStyle="NotSet|None|Dotted|Dashed|Solid|Double|Groove|Ridge|
Inset|Outset"
BorderWidth="size"
Caption="string"
CaptionAlign="NotSet|Top|Bottom|Left|Right"
CellPadding="integer"
CellSpacing="integer"
CssClass="string"
DayNameFormat="Full|Short|FirstLetter|FirstTwoLetters|Shortest"
Enabled="True|False"
EnableTheming="True|False"
EnableViewState="True|False"
FirstDayOfWeek="Sunday|Monday|Tuesday|Wednesday|Thursday|Friday|
Saturday|Default"
Font-Bold="True|False"
Font-Italic="True|False"
Font-Names="string"
Font-Overline="True|False"
Font-Size="string|Smaller|Larger|XX-Small|X-Small|Small|Medium|
Large|X-Large|XX-Large"
Font-Strikeout="True|False"
Font-Underline="True|False"
ForeColor="color name|#dddddd"
Height="size"
ID="string"
NextMonthText="string"
NextPrevFormat="CustomText|ShortMonth|FullMonth"
OnDataBinding="DataBinding event handler"
OnDayRender="DayRender event handler"
OnDisposed="Disposed event handler"
OnInit="Init event handler"
OnLoad="Load event handler"
OnPreRender="PreRender event handler"
OnSelectionChanged="SelectionChanged event handler"
OnUnload="Unload event handler"
OnVisibleMonthChanged="VisibleMonthChanged event handler"
PrevMonthText="string"
runat="server"
SelectedDate="string"
SelectionMode="None|Day|DayWeek|DayWeekMonth"
SelectMonthText="string"
SelectWeekText="string"
ShowDayHeader="True|False"
ShowGridLines="True|False"
ShowNextPrevMonth="True|False"
ShowTitle="True|False"
SkinID="string"
Style="string"
TabIndex="integer"
TitleFormat="Month|MonthYear"
ToolTip="string"
UseAccessibleHeader="True|False"
Visible="True|False"
VisibleDate="string"
Width="size"
>
<DayHeaderStyle/>
<DayStyle/>
<NextPrevStyle/>
<OtherMonthDayStyle/>
<SelectedDayStyle/>
<SelectorStyle/>
<TitleStyle/>
<TodayDayStyle/>
<WeekendDayStyle/>
</asp:Calendar>
Comentarios
Se utiliza el control Calendar para mostrar un calendario de un solo mes que permite al usuario seleccionar fechas y moverse a los meses anteriores y posteriores.
Si se establece el valor de la propiedad SelectionMode, se puede especificar si el usuario tiene la posibilidad de seleccionar un solo día, una semana o un mes completo, o se puede deshabilitar totalmente la selección de fecha.
Al establecer las propiedades de estilo de las distintas partes del control, se personaliza la apariencia del control Calendar. En la siguiente tabla se recogen las diferentes propiedades de estilo del control Calendar.
Objeto de estilo |
Descripción |
Clase de estilo |
|---|---|---|
Estilo de la sección del calendario donde aparecen los nombres de los días de la semana. |
||
Estilo de los días del mes que se muestra. .gif "Nota") Nota:
Los fines de semana, la fecha actual y el día seleccionado pueden tener estilos diferentes si se establecen las propiedades WeekendDayStyle, TodayDayStyle y SelectedDayStyle, respectivamente.
|
||
Estilo de las secciones situadas en los extremos izquierdo y derecho de la barra de título donde se encuentran los controles LinkButton de navegación por los meses. |
||
Estilo de los días de los meses anterior y posterior al mes que aparece en la vista actual. |
||
Estilo de la fecha seleccionada. Nota:
Si no está establecida esta propiedad, para mostrar la fecha seleccionada se utiliza el estilo especificado por la propiedad DayStyle.
|
||
Estilo de la columna situada a la izquierda del control Calendar que contiene vínculos para seleccionar una semana o el mes completo. |
||
Estilo de la barra de título situada en la parte superior del calendario que contiene el nombre del mes y vínculos de navegación por los meses. Nota:
Si está establecida la propiedad NextPrevStyle, ésta reemplaza el estilo de los controles de navegación de mes anterior y posterior que se encuentran en los extremos de la barra de título.
|
||
Estilo de la fecha actual. Nota:
Si no está establecida esta propiedad, para mostrar la fecha actual se utiliza el estilo especificado por la propiedad DayStyle.
|
||
Estilo de los días de fin de semana. Nota:
Si no está establecida esta propiedad, para mostrar las fechas de los fines de semana se utiliza el estilo especificado por la propiedad DayStyle.
|
También se puede controlar la apariencia del control Calendar mostrando u ocultando las distintas partes del control. En la siguiente tabla se recogen las distintas partes del control Calendar que se pueden mostrar u ocultar.
Propiedad |
Descripción |
|---|---|
Muestra u oculta la sección que muestra los días de la semana. |
|
Muestra u oculta las líneas de cuadrícula entre los días del mes. |
|
Muestra u oculta los controles de navegación para desplazarse al mes siguiente o al mes anterior. |
|
Muestra u oculta la sección de título. |
Si bien el control Calendar no admite el enlace a un origen de datos, se puede modificar el contenido y el formato de las celdas de fecha individuales. Antes de que se muestre el control Calendar en la página Web, crea y ensambla los componentes que forman el control. Se provoca el evento DayRender cuando se crea cada celda de fecha en el control Calendar. Se puede controlar el contenido y el formato de una celda de fecha en el momento de crearla proporcionando código en el controlador de eventos para el evento DayRender.
Nota El control Calendar genera JavaScript en el explorador del cliente. El explorador del cliente debe tener habilitado JavaScript para que este control funcione correctamente. Para obtener más información sobre las secuencias de comandos en el cliente, vea Script de cliente en páginas web ASP.NET.
Para obtener información sobre las propiedades que admite cada clase de estilo, vea Propiedades de los objetos de estilo.
Para obtener información detallada sobre los eventos y propiedades del control Calendar, consulte la documentación referente a la clase Calendar.
Ejemplo
En el ejemplo siguiente se muestra cómo declarar un control Calendar en un archivo .aspx. La declaración incluye varias propiedades de objetos de estilo y establece el método Date_Selected como controlador del evento SelectionChanged.
<asp:Calendar id="Calendar2"
OnSelectionChanged="Date_Selected"
SelectionMode="DayWeekMonth"
Font-Name="Verdana"
Font-Size="12px"
NextPrevFormat="ShortMonth"
SelectWeekText="week"
SelectMonthText="month"
runat="server">
<TodayDayStyle Font-Bold="True"/>
<DayHeaderStyle Font-Bold="True"/>
<OtherMonthDayStyle ForeColor="gray"/>
<TitleStyle BackColor="#3366ff"
ForeColor="white"
Font-Bold="True"/>
<SelectedDayStyle BackColor="#ffcc66"
Font-Bold="True"/>
<NextPrevStyle ForeColor="white"
Font-Size="10px"/>
<SelectorStyle BackColor="#99ccff"
ForeColor="navy"
Font-Size="9px"/>
</asp:Calendar>
En el siguiente ejemplo se muestra un método de control de eventos para el evento SelectionChanged de un control Calendar. Al consultar el parámetro SelectedDates del control Calendar, se puede determinar el número de días seleccionados y, por consiguiente, si el usuario selecciona un día, una semana o un mes. La información sobre la selección se muestra en un control de servidor Web Label.
Sub Date_Selected(sender as Object sender, e As EventArgs)
Select (Calendar1.SelectedDates.Count)
Case 0: 'None
Label1.Text = "No dates are currently selected"
Case 1: 'Day
Label1.Text = "The selected date is " & _
Calendar1.SelectedDate.ToShortDateString
Case 7: 'Week
Label1.Text = "The selection is a week beginning " & _
Calendar1.SelectedDate.ToShortDateString
Case Else: 'Month
Label1.Text = "The selection is a month beginning " & _
Calendar1.SelectedDate.ToShortDateString
End Select
End Sub
protected void Date_Selected(object sender, EventArgs e)
{
switch (Calendar1.SelectedDates.Count)
{
case (0): //None
{
Label1.Text = "No dates are currently selected";
break;
}
case (1): //Day
{
Label1.Text = "The selected date is " +
Calendar1.SelectedDate.ToShortDateString();
break;
}
case (7): //Week
{
Label1.Text = "The selection is a week beginning " +
Calendar1.SelectedDate.ToShortDateString();
break;
}
default: //Month
Label1.Text = "The selection is a month beginning " +
Calendar1.SelectedDate.ToShortDateString();
break;
}
}
Vea también
Conceptos
Información general sobre Calendar (Control de servidor Web)