質問編集履歴

2

コードをわかりやすく変更しました。

2018/02/21 01:59

投稿

picotoyou8
picotoyou8

スコア8

test CHANGED
File without changes
test CHANGED
@@ -20,6 +20,8 @@
20
20
 
21
21
  実際に作成したプログラムを追記いたします。
22
22
 
23
+ ```
24
+
23
25
  <%@ Page Language="VB" ContentType="text/html" %>
24
26
 
25
27
  <%@ Import Namespace="System.Data" %>
@@ -172,7 +174,7 @@
172
174
 
173
175
  </html>
174
176
 
175
-
177
+ ```
176
178
 
177
179
  上記の方法だと、1日に1セルしかないカレンダーが表示されるため、作業結果(status)によって作業ごとに色分けしたいのですが、実現できません。
178
180
 
@@ -191,3 +193,9 @@
191
193
  よろしくお願いいたします。
192
194
 
193
195
  ![イメージ説明](fd99585afd60427e17a01edbed6eba27.png)
196
+
197
+
198
+
199
+ 失礼いたしました。
200
+
201
+ コードをわかりやすくしました。

1

実施内容とイメージを追記しました

2018/02/21 01:59

投稿

picotoyou8
picotoyou8

スコア8

test CHANGED
File without changes
test CHANGED
@@ -15,3 +15,179 @@
15
15
 
16
16
 
17
17
  お手数をおかけいたしますが、よろしくお願いいたします。
18
+
19
+
20
+
21
+ 実際に作成したプログラムを追記いたします。
22
+
23
+ <%@ Page Language="VB" ContentType="text/html" %>
24
+
25
+ <%@ Import Namespace="System.Data" %>
26
+
27
+ <%@ Import Namespace="System.Data.SqlClient" %>
28
+
29
+ <%@ Import Namespace="Npgsql" %>
30
+
31
+ <%@ Import Namespace="NpgsqlTypes" %>
32
+
33
+ <script runat="Server">
34
+
35
+ ' それぞれの日付セルをレンダリングするタイミングで実行
36
+
37
+ Sub cal_DayRender(sender As Object, e As DayRenderEventArgs)
38
+
39
+ Dim dtNow As DateTime = DateTime.Now
40
+
41
+ Dim dtToday As DateTime = dtNow.Date
42
+
43
+ Dim calDate As DateTime
44
+
45
+ Dim subDate As Integer
46
+
47
+ Dim DA As NpgsqlDataAdapter
48
+
49
+ Dim DT As New DataTable
50
+
51
+ Dim SQLDS As New DataSet()
52
+
53
+ Dim ST As NpgsqlTransaction
54
+
55
+ Dim objCom As NpgsqlCommand
56
+
57
+ Dim conn As NpgsqlConnection
58
+
59
+ conn = New NpgsqlConnection("Server=xx.xx.xx.xx;Port=5432;User Id=abc;Password=xyz;Database=TEST_db")
60
+
61
+ ' 出力する日付セルに対応するスケジュール情報を抽出
62
+
63
+ objCom = New NpgsqlCommand("SELECT * FROM mobile.TEST_DATA WHERE plan_date=@sdate AND delete_flg is null;", conn, ST)
64
+
65
+ objCom.Parameters.Add("@sdate", e.Day.Date)
66
+
67
+ conn.Open()
68
+
69
+ DA = New NpgsqlDataAdapter(objCom)
70
+
71
+ DT = New DataTable
72
+
73
+ DA.Fill(SQLDS, "TEST_tbl")
74
+
75
+ ' 取得したスケジュール情報を基にLiteralControl(固定文字列)を生成し、日付セル(e.Call)配下のコントロールとして追加
76
+
77
+ For Each HeaderRow In SQLDS.Tables("TEST_tbl").Rows
78
+
79
+ e.Cell.Controls.Add(New LiteralControl("<br />" & String.Format("{0}:{1}", HeaderRow("task_name"), HeaderRow("status"))))
80
+
81
+ calDate = e.Day.Date
82
+
83
+ subDate = DateDiff(DateInterval.Day, dtToday, calDate)
84
+
85
+ Select Case HeaderRow("status")
86
+
87
+ Case 0
88
+
89
+ If subDate < 0 Then
90
+
91
+ e.Cell.BackColor = System.Drawing.Color.Gray
92
+
93
+ Else
94
+
95
+ e.Cell.BackColor = System.Drawing.Color.Yellow
96
+
97
+ End If
98
+
99
+ Case 2
100
+
101
+ e.Cell.BackColor = System.Drawing.Color.Green
102
+
103
+ Case 3
104
+
105
+ e.Cell.BackColor = System.Drawing.Color.Red
106
+
107
+ End Select
108
+
109
+ Next
110
+
111
+ conn.Close()
112
+
113
+ End Sub
114
+
115
+ </script>
116
+
117
+ <html>
118
+
119
+ <head>
120
+
121
+ <title>スケジュールをカレンダー上に表示する</title>
122
+
123
+ </head>
124
+
125
+ <body>
126
+
127
+ <form runat="Server">
128
+
129
+ <asp:Calendar id="cal" runat="server"
130
+
131
+ DayHeaderStyle-BackColor="#FFCC66"
132
+
133
+ onDayRender="cal_DayRender"
134
+
135
+ BorderWidth="1px" BorderColor="White" Font-Name="Verdana"
136
+
137
+ Font-Size="9pt" TitleStyle-BackColor="#FFCC66"
138
+
139
+ TitleStyle-Font-Size="12px" TitleStyle-Font-Bold="true"
140
+
141
+ DayStyle-VerticalAlign="Top" DayStyle-Height="50px"
142
+
143
+ DayStyle-Width="14%" SelectedDayStyle-BackColor="Navy"
144
+
145
+ ShowNextPrev="True" NextPrevFormat="FullMonth" BackColor="White" Font-Names="Verdana" ForeColor="Black" Height="190px" Width="700px">
146
+
147
+ <DayHeaderStyle Font-Bold="True" Font-Size="8pt"></DayHeaderStyle>
148
+
149
+
150
+
151
+ <DayStyle VerticalAlign="Top" Height="50px"></DayStyle>
152
+
153
+
154
+
155
+ <NextPrevStyle Font-Bold="True" Font-Size="8pt" ForeColor="#333333" VerticalAlign="Bottom" />
156
+
157
+ <OtherMonthDayStyle ForeColor="#999999" />
158
+
159
+ <SelectedDayStyle BackColor="#333399" ForeColor="White" />
160
+
161
+
162
+
163
+ <TitleStyle BackColor="White" Font-Bold="True" Font-Size="12pt" BorderColor="Black" BorderWidth="4px" ForeColor="#333399"></TitleStyle>
164
+
165
+ <TodayDayStyle BackColor="#CCCCCC" />
166
+
167
+ </asp:Calendar>
168
+
169
+ </form>
170
+
171
+ </body>
172
+
173
+ </html>
174
+
175
+
176
+
177
+ 上記の方法だと、1日に1セルしかないカレンダーが表示されるため、作業結果(status)によって作業ごとに色分けしたいのですが、実現できません。
178
+
179
+ 下にイメージを載せています。
180
+
181
+ 左が実現したいイメージで、右がプログラムの実行結果です。
182
+
183
+ まず、知りたいのは、calendarでこのようなことが実現可能なのでしょうか?
184
+
185
+ 可能なのでしたら、方法を教えていただければありがたいです。
186
+
187
+ また、不可能な場合、どのような手段があるかを教えていただければありがたいです。
188
+
189
+
190
+
191
+ よろしくお願いいたします。
192
+
193
+ ![イメージ説明](fd99585afd60427e17a01edbed6eba27.png)