Back to Devexpress

ASPxClientCalendar.SetVisibleDate(date) Method

aspnet-js-aspxclientcalendar-dot-setvisibledate-x28-date-x29.md

latest3.7 KB
Original Source

ASPxClientCalendar.SetVisibleDate(date) Method

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

Declaration

ts
SetVisibleDate(
    date: Date
): void

Parameters

NameTypeDescription
dateDate

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.

javascript
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);
}
aspx
<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

GetVisibleDate

EnableClientSideAPI

Calendar

ASPxClientCalendar Class

ASPxClientCalendar Members