- 追加された行はこの色です。
- 削除された行はこの色です。
閲覧総計:&counter(); (本日:&counter(today); 昨日:&counter(yesterday);)
カレンダの「日付」をクリックした時の処理事例として、DBへのINSERT(挿入)を行っ
てみた。
カレンダの日付をクリックするだけで、その日の昼食弁当の予約がMS-AccessDBへINSERT
され、その情報がカレンダに表示され確認出来るものである。 10/08/10
#ref(sqlCalDescDisp01.JPG);
【ポイント】
AccessDataSourceコントロールを利用せずにプログラムから直接DBにアクセスし、
SQLのINSERT(挿入)コマンドでデータをDBに挿入する。
開発環境:VWD2008 + Access2003 + SQL Server2008
サーバ:ASP.NET3.5 + Access2003
【機能】 カレンダの日付をクリックするだけで、その日の昼食弁当の予約がMS-AccessDBへINSERT
され、その情報がカレンダに表示され確認出来る。
【稼働画面】
#ref(sqlCalDescDesign01.JPG);
#ref(sqlCalDescData01.JPG);
#ref(sqlCalDescDisp01.JPG);
【sqlCalDescription.aspx】
<%@ Page ContentType="text/html" Language="VB" %>
<%@ Import Namespace="System.Data" %>
<%@ Import Namespace="System.Data.Common" %>
<%@ Import Namespace="System.Drawing" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<script runat="Server">
'SQL ServerDBのConnectionString
Dim MyDbConnectionString As String = "Data Source=.\SQLEXPRESS;AttachDbFilename=|DataDirectory|\SQLCalendar.mdf;Integrat ed Security=True;User Instance=True"
'SQL ServerDBのProviderName
Dim MyDbProviderName As String = "System.Data.SqlClient"
Dim scheInfo As DbDataReader
' それぞれの日付セルをレンダリングするタイミングで実行
Sub cal_DayRender(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.DayRenderEventArgs)
Dim setting As ConnectionStringSettings = _
ConfigurationManager.ConnectionStrings(MyDbConnectionString)
Dim factory As DbProviderFactory = _
DbProviderFactories.GetFactory(MyDbProviderName)
Using db As DbConnection = factory.CreateConnection()
db.ConnectionString = MyDbConnectionString
' 出力する日付セルに対応するスケジュール情報を抽出
Dim comm As DbCommand = factory.CreateCommand()
comm.CommandText = "SELECT [ID] FROM [schedule02] WHERE [sdate]=@sdate"
comm.Connection = db
Dim param As DbParameter = factory.CreateParameter()
param.ParameterName = "@sdate"
param.Value = e.Day.Date.ToString("yyyy/MM/dd")
comm.Parameters.Add(param)
db.Open()
Dim reader As DbDataReader = comm.ExecuteReader()
' スケジュールが存在する場合にのみセルの背景色をセット
If reader.HasRows Then e.Cell.BackColor = Color.Lavender
End Using
End Sub
' 選択セルが変更されたタイミングで実行
Protected Sub cal_SelectionChanged(ByVal sender As Object, ByVal e As System.EventArgs)
Dim setting As ConnectionStringSettings = _
ConfigurationManager.ConnectionStrings(MyDbConnectionString)
Dim factory As DbProviderFactory = _
DbProviderFactories.GetFactory(MyDbProviderName)
Using db As DbConnection = factory.CreateConnection()
db.ConnectionString = MyDbConnectionString
' 選択された日付をキーにscheduleテーブルを検索
Dim comm As DbCommand = factory.CreateCommand()
comm.CommandText = "SELECT * FROM [schedule02] WHERE [sdate]=@sdate ORDER BY [stime] ASC"
comm.Connection = db
Dim param As DbParameter = factory.CreateParameter()
param.ParameterName = "@sdate"
param.Value = cal.SelectedDate.ToString("yyyy/MM/dd")
comm.Parameters.Add(param)
db.Open()
' 取得したDataReaderをRepeaterコントロールにバインド
scheInfo = comm.ExecuteReader()
rep.DataBind()
End Using
End Sub
</script>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>スケジュールの詳細を表示する</title>
</head>
<body>
<form id="form1" runat="server">
<div>
<table border="0">
<tr><td valign="top" width="230">
<asp:Calendar id="cal" runat="Server" Width="200" Height="200"
DayHeaderStyle-BackColor="#FFCC66"
onDayRender="cal_DayRender" OnSelectionChanged="cal_SelectionChanged"
ShowGridLines="true"
BorderWidth="3" BorderColor="Black" Font-Name="Verdana"
Font-Size="10px" TitleStyle-BackColor="#FFCC66"
TitleStyle-Font-Size="12px" TitleStyle-Font-Bold="true"
DayStyle-VerticalAlign="Top" SelectedDayStyle-BackColor="Navy"
ShowNextPrev="True" NextPrevFormat="FullMonth">
<SelectedDayStyle BackColor="#CC5533" />
</asp:Calendar>
</td><td valign="top" width="370">
<asp:Repeater id="rep" runat="Server" DataSource="<%# scheInfo %>">
<HeaderTemplate>
<table width="100%" bgcolor="#cee3f0" border="0">
<tr>
<td><span style="font-weight:bold;">
<%# cal.SelectedDate.ToString("yyyy年MM月dd日") %>のスケジュール
</span></td>
</tr>
</table>
<dl>
</HeaderTemplate>
<ItemTemplate>
<dt style="font-weight:bold;">
<%# DataBinder.Eval(Container.DataItem, "title") %>
(<%#DataBinder.Eval(Container.DataItem, "stime")%>〜
<%#DataBinder.Eval(Container.DataItem, "etime")%>)</dt>
<dd><%# DataBinder.Eval(Container.DataItem, "memo") %></dd>
</ItemTemplate>
<FooterTemplate></dl></FooterTemplate>
</asp:Repeater>
</td></tr>
</table>
</div>
</form>
</body>
</html>
*DBにMS-Access2003を使用した場合 [#ib6937bc]
【ポイント】
DB接続の為のConnectionString情報とProviderName情報の2つを変更するだけでDBを
SQL ServerからMS-Accessに変更できる。
'MS-AccessDBのConnectionString
Dim MyDbConnectionString As String = "Provider=Microsoft.Jet.OLEDB.4.0;Data Source=|DataDirectory|\AccessDB.mdb;Persist Security Info=True"
'MS-AccessDBのProviderName
Dim MyDbProviderName As String = "System.Data.OleDb"
【稼働画面】
#ref(acCalDescDesign01.JPG);
#ref(acCalDescData01.JPG);
#ref(sqlCalDescDisp01.JPG);
【acCalDescription.aspx】
<%@ Page ContentType="text/html" Language="VB" %>
<%@ Import Namespace="System.Data" %>
<%@ Import Namespace="System.Data.Common" %>
<%@ Import Namespace="System.Drawing" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<script runat="Server">
'MS-AccessDBのConnectionString
Dim MyDbConnectionString As String = "Provider=Microsoft.Jet.OLEDB.4.0;Data Source=|DataDirectory|\AccessDB.mdb;Persist Security Info=True"
'MS-AccessDBのProviderName
Dim MyDbProviderName As String = "System.Data.OleDb"
Dim scheInfo As DbDataReader
' それぞれの日付セルをレンダリングするタイミングで実行
Sub cal_DayRender(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.DayRenderEventArgs)
Dim setting As ConnectionStringSettings = _
ConfigurationManager.ConnectionStrings(MyDbConnectionString)
Dim factory As DbProviderFactory = _
DbProviderFactories.GetFactory(MyDbProviderName)
Using db As DbConnection = factory.CreateConnection()
db.ConnectionString = MyDbConnectionString
' 出力する日付セルに対応するスケジュール情報を抽出
Dim comm As DbCommand = factory.CreateCommand()
comm.CommandText = "SELECT [ID] FROM [schedule02] WHERE [sdate]=@sdate"
comm.Connection = db
Dim param As DbParameter = factory.CreateParameter()
param.ParameterName = "@sdate"
param.Value = e.Day.Date.ToString("yyyy/MM/dd")
comm.Parameters.Add(param)
db.Open()
Dim reader As DbDataReader = comm.ExecuteReader()
' スケジュールが存在する場合にのみセルの背景色をセット
If reader.HasRows Then e.Cell.BackColor = Color.Lavender
End Using
End Sub
' 選択セルが変更されたタイミングで実行
Protected Sub cal_SelectionChanged(ByVal sender As Object, ByVal e As System.EventArgs)
Dim setting As ConnectionStringSettings = _
ConfigurationManager.ConnectionStrings(MyDbConnectionString)
Dim factory As DbProviderFactory = _
DbProviderFactories.GetFactory(MyDbProviderName)
Using db As DbConnection = factory.CreateConnection()
db.ConnectionString = MyDbConnectionString
' 選択された日付をキーにscheduleテーブルを検索
Dim comm As DbCommand = factory.CreateCommand()
comm.CommandText = "SELECT * FROM [schedule02] WHERE [sdate]=@sdate ORDER BY [stime] ASC"
comm.Connection = db
Dim param As DbParameter = factory.CreateParameter()
param.ParameterName = "@sdate"
param.Value = cal.SelectedDate.ToString("yyyy/MM/dd")
comm.Parameters.Add(param)
db.Open()
' 取得したDataReaderをRepeaterコントロールにバインド
scheInfo = comm.ExecuteReader()
rep.DataBind()
End Using
End Sub
</script>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>スケジュールの詳細を表示する</title>
</head>
<body>
<form id="form1" runat="server">
<div>
<table border="0">
<tr><td valign="top" width="230">
<asp:Calendar id="cal" runat="Server" Width="200" Height="200"
DayHeaderStyle-BackColor="#FFCC66"
onDayRender="cal_DayRender" OnSelectionChanged="cal_SelectionChanged"
ShowGridLines="true"
BorderWidth="3" BorderColor="Black" Font-Name="Verdana"
Font-Size="10px" TitleStyle-BackColor="#FFCC66"
TitleStyle-Font-Size="12px" TitleStyle-Font-Bold="true"
DayStyle-VerticalAlign="Top" SelectedDayStyle-BackColor="Navy"
ShowNextPrev="True" NextPrevFormat="FullMonth">
<SelectedDayStyle BackColor="#CC5533" />
</asp:Calendar>
</td><td valign="top" width="370">
<asp:Repeater id="rep" runat="Server" DataSource="<%# scheInfo %>">
<HeaderTemplate>
<table width="100%" bgcolor="#cee3f0" border="0">
<tr>
<td><span style="font-weight:bold;">
<%# cal.SelectedDate.ToString("yyyy年MM月dd日") %>のスケジュール
</span></td>
</tr>
</table>
<dl>
</HeaderTemplate>
<ItemTemplate>
<dt style="font-weight:bold;">
<%# DataBinder.Eval(Container.DataItem, "title") %>
(<%#DataBinder.Eval(Container.DataItem, "stime")%>〜
<%#DataBinder.Eval(Container.DataItem, "etime")%>)</dt>
<dd><%# DataBinder.Eval(Container.DataItem, "memo") %></dd>
</ItemTemplate>
<FooterTemplate></dl></FooterTemplate>
</asp:Repeater>
</td></tr>
</table>
</div>
</form>
</body>
</html>
【参考にしたページ】
1.「Calendarコントロール上で選択された日付について処理を行うには?」05/08/12
http://www.atmarkit.co.jp/fdotnet/dotnettips/337aspcalendarsel/aspcalendarsel.html
2.「データソース・コントロールでいってみよう(前編)」 06/07/29
http://www.atmarkit.co.jp/fdotnet/vs2005db/vs2005db_06/vs2005db_06_03.html
3.「ASP.NET アクセスデータにアクセスする(コーディング)」
http://3939deb.seesaa.net/article/107785168.html
#comment_nospam
#vote(参考になった[0],ふつう[0],参考にならなかった[0])