Skip to main content

ASPxClientCalendar.SetVisibleDate(date) Method

Sets the date that specifies the month and year to be displayed in the calendar.

#Declaration

TypeScript
SetVisibleDate(
    date: Date
): void

#Parameters

Name Type Description
date Date

The date that specifies calendar’s visible month and year.

#Remarks

Use the SetVisibleDate method to specify the month and year that should be displayed within the calendar.

#Example

This example illustrates how to use the SetVisibleDate method to specify the month and year that should be displayed within the calendar.

function btn_OnClick(s, e) {
    if (!ASPxClientEdit.ValidateEditorsInContainer(null))
        return;
    var year = cmbYear.GetValue();
    var month = cmbMonth.GetValue();
    var day = 10;
    var myDate = new Date(year, month, day);
    calendar.SetVisibleDate(myDate);
}
<table>
    <tr>
        <td>
            <dx:ASPxComboBox ID="cmbYear" runat="server" ClientInstanceName="cmbYear">
                <Items>
                    <dx:ListEditItem Text="2012" Value="2012" />
                    <dx:ListEditItem Text="2011" Value="2011" />
                    <dx:ListEditItem Text="2010" Value="2010" />
                    <dx:ListEditItem Text="2009" Value="2009" />
                    <dx:ListEditItem Text="2008" Value="2008" />
                    <dx:ListEditItem Text="2007" Value="2007" />
                </Items>
                <ValidationSettings RequiredField-IsRequired="true" Display="Dynamic" />
            </dx:ASPxComboBox>
        </td>
        <td>
            <dx:ASPxComboBox ID="cmbMonth" runat="server" ClientInstanceName="cmbMonth">
                <Items>
                    <dx:ListEditItem Text="January" Value="0" />
                    <dx:ListEditItem Text="February" Value="1" />
                    <dx:ListEditItem Text="March" Value="2" />
                    <dx:ListEditItem Text="April" Value="3" />
                    <dx:ListEditItem Text="May" Value="4" />
                    <dx:ListEditItem Text="June" Value="5" />
                    <dx:ListEditItem Text="July" Value="6" />
                    <dx:ListEditItem Text="August" Value="7" />
                    <dx:ListEditItem Text="September" Value="8" />
                    <dx:ListEditItem Text="October" Value="9" />
                    <dx:ListEditItem Text="November" Value="10" />
                    <dx:ListEditItem Text="December" Value="11" />
                </Items>
                    <ValidationSettings RequiredField-IsRequired="true" Display="Dynamic" />
            </dx:ASPxComboBox>
        </td>            
        <td>
            <dx:ASPxButton ID="ASPxButton1" runat="server" Text="Select Date" AutoPostBack="false">
                <ClientSideEvents Click="btn_OnClick" />
            </dx:ASPxButton>
        </td>
    </tr>
    <tr>
        <td colspan="3">
            <dx:ASPxCalendar ID="ASPxCalendar1" runat="server" ClientInstanceName="calendar">
                <DayStyle>
                    <Paddings PaddingBottom="40px" PaddingRight="40px" />
                    <Border BorderColor="#888888" BorderWidth="1px" BorderStyle="Solid"></Border>
                </DayStyle>
            </dx:ASPxCalendar>
        </td>
    </tr>
</table>
See Also