DevExpress の ASPxDateNavigator でのカレンダー複数（横）設定

DevExpress の ASPxDateNavigator でのカレンダー複数（横）設定のサンプルです。

現状の画面デザインはこのようになっています。

＜カレンダー複数（横）設定＞

・「ASPxDateNavigator」の「Properties」に「Columns=”2″」を設定します。

【サンプルプログラム】

<form id="form1" runat="server">
<table>
<tr>
<td valign="top">
    <dxwschs:ASPxViewSelector ID="ASPxViewSelector1" runat="server" 
        MasterControlID="ASPxScheduler1">
    </dxwschs:ASPxViewSelector>
    <dxwschs:ASPxDateNavigator ID="ASPxDateNavigator1" runat="server" 
        MasterControlID="ASPxScheduler1" Theme="RedWine">
        <Properties Columns="2">
        </Properties>
    </dxwschs:ASPxDateNavigator>
</td>
<td>
<div>
    <dxwschs:ASPxScheduler ID="ASPxScheduler1" runat="server" 
        AppointmentDataSourceID="XpoDataSource2" ClientIDMode="AutoID" 
        ResourceDataSourceID="XpoDataSource1" Start="2017-08-11" Theme="RedWine" 
        Width="700px" GroupType="Resource">
        <Storage>
            <Appointments AutoRetrieveId="True">
                <Mappings AllDay="ALLDAY" AppointmentId="ID" Description="DESCRIPTION" 
                    End="ENDDATE" Label="LABEL" Location="LOCATION" RecurrenceInfo="RECURRENCEINFO" 
                    ReminderInfo="REMINDERINFO" ResourceId="RESOURCEID" Start="STARTDATE" 
                    Status="STATUS" Subject="SUBJECT" Type="TYPE" />
            </Appointments>
            <Resources>
                <Mappings Caption="NAME" ResourceId="ID" />
            </Resources>
        </Storage>
        <Views>
            <DayView ResourcesPerPage="1" >
                <TimeRulers>
                    <cc1:TimeRuler></cc1:TimeRuler>
                </TimeRulers>
                <DayViewStyles ScrollAreaHeight="500px">
                </DayViewStyles>
            </DayView>
            <WorkWeekView ResourcesPerPage="1">
                <TimeRulers>
                    <cc1:TimeRuler></cc1:TimeRuler>
                </TimeRulers>
            </WorkWeekView>
            <WeekView ResourcesPerPage="1">
            </WeekView>
            <MonthView ResourcesPerPage="1">
            </MonthView>
            <TimelineView ResourcesPerPage="1">
            </TimelineView>
            <FullWeekView Enabled="True" ResourcesPerPage="1" MenuCaption="5日分ビュー" 
                ShortDisplayName="5日分">
                <TimeRulers>
                    <cc1:TimeRuler></cc1:TimeRuler>
                </TimeRulers>
            </FullWeekView>
        </Views>
        <OptionsBehavior ShowViewSelector="False" ShowViewNavigator="False" />
    </dxwschs:ASPxScheduler>
</div>
</td>
</tr>
</table>
<div>
    <dx:XpoDataSource ID="XpoDataSource1" runat="server" 
        TypeName="Sample_10.SAMPLE.SCHEDULE_MST">
    </dx:XpoDataSource>
    <dx:XpoDataSource ID="XpoDataSource2" runat="server" 
        TypeName="Sample_10.SAMPLE.SCHEDULE_INFO">
    </dx:XpoDataSource>
</div>
</form>

<table>

<tr>

<dxwschs:ASPxViewSelector ID="ASPxViewSelector1" runat="server"

MasterControlID="ASPxScheduler1">

</dxwschs:ASPxViewSelector>

<dxwschs:ASPxDateNavigator ID="ASPxDateNavigator1" runat="server"

MasterControlID="ASPxScheduler1" Theme="RedWine">

</Properties>

</dxwschs:ASPxDateNavigator>

</td>

<td>

<div>

<dxwschs:ASPxScheduler ID="ASPxScheduler1" runat="server"

AppointmentDataSourceID="XpoDataSource2" ClientIDMode="AutoID"

ResourceDataSourceID="XpoDataSource1" Start="2017-08-11" Theme="RedWine"

Width="700px" GroupType="Resource">

<Mappings AllDay="ALLDAY" AppointmentId="ID" Description="DESCRIPTION"

End="ENDDATE" Label="LABEL" Location="LOCATION" RecurrenceInfo="RECURRENCEINFO"

ReminderInfo="REMINDERINFO" ResourceId="RESOURCEID" Start="STARTDATE"

Status="STATUS" Subject="SUBJECT" Type="TYPE" />

</Appointments>

</Resources>

</Storage>

<Views>

<cc1:TimeRuler></cc1:TimeRuler>

</TimeRulers>

</DayViewStyles>

</DayView>

<cc1:TimeRuler></cc1:TimeRuler>

</TimeRulers>

</WorkWeekView>

</WeekView>

</MonthView>

</TimelineView>

<FullWeekView Enabled="True" ResourcesPerPage="1" MenuCaption="5日分ビュー"

ShortDisplayName="5日分">

<cc1:TimeRuler></cc1:TimeRuler>

</TimeRulers>

</FullWeekView>

</Views>

</dxwschs:ASPxScheduler>

</div>

</td>

</tr>

</table>

<div>

<dx:XpoDataSource ID="XpoDataSource1" runat="server"

TypeName="Sample_10.SAMPLE.SCHEDULE_MST">

</dx:XpoDataSource>

<dx:XpoDataSource ID="XpoDataSource2" runat="server"

TypeName="Sample_10.SAMPLE.SCHEDULE_INFO">

</dx:XpoDataSource>

</div>

</form>

それでは、実行して動作確認を行います。

↓

無事にスケジュールのカレンダー複数（横）設定が出来ました。

MENU

最近の投稿

人気記事

MENU

DevExpress の ASPxDateNavigator でのカレンダー複数（横）設定

関連記事はこちら:

最近の投稿

人気記事