はじめに
【C#】のWebアプリケーションのフレームワークである 【ASP.NET Cor MVC】のDB使用手順を確認。
以下の続き
③ASP.NET Core MVCでDB接続する
今回はVisual StudioでASP.NET Core MVCアプリケーションを開発し、DB使用します。
③-1 データベースのアクセス作成方法
データベースのテーブルの元となるデータモデルクラスを以下のように定義します。
1・・・ Modelsフォルダを右クリックし、「追加」→「クラス」で「SumData.cs」という名前のファイルを追加します。
using System.ComponentModel.DataAnnotations;
namespace SampleMVCApp.Models
{
public class SumData
{
// プライマリキー
public int Id { get; set; }
// 計算対象の数値
public int Number { get; set; }
// 計算結果
public int Result { get; set; }
// 作成日時
[DataType(DataType.Date)]
public DateTime CreatedDate { get; set; }
// 更新日時
[DataType(DataType.Date)]
public DateTime UpdatedDate { get; set; }
}
}
2・・・ Visual Studioをインストール
以下のwinget search コマンドで
インストールするパッケージの ID を確認:
3・・・ 確認した ID を使ってインストールコマンドを実行する:
例えば、ID が Microsoft.VisualStudio.2022 であれば、
次のようにインストールします:。
winget install Microsoft.VisualStudio.2022.Community
4・・・ インストールされたVisual Studioで、
前回作成した、ソリューションファイル
C:\temp\ASP\SampleMVCApp\SampleMVCApp.generated.sln
を開く。
5・・・ スキャフォールディングアイテムの追加
Models フォルダを右クリックし、「追加」→「新規スキャフォールディングアイテム」を選択します。
CRUD機能【Create(登録)、Read(参照)、
Update(更新)、Delete(削除)機能】を持つ
コントローラーとビューが自動的に生成されます。
6・・・ ツール メニューから「NuGetパッケージマネージャー」
→「パッケージマネージャーコンソール」を選択します。
7・・・ コンソールで以下のコマンドを実行して、マイグレーションを
追加し、データベースの初期化を行います。
Add-Migration InitialCreate
Update-Database
8・・・ ツールバーの「再生」ボタン(緑の再生アイコン)を
クリックしてもアプリケーションを起動します。
9・・・ 表示された http://localhost:5228/ に
クリックしてもアプリケーションを起動します。
/SumDatas
をつけて実行する。
例;http://localhost:xxxx/SumDatas
xxxxは異なるので注意、
10・・・ 「Create New」でデータの入力が可能です。
②-2 自動作成された、DB使用機能の流用
以下、DB使用の際にFrmControllerで、フォームから送信された日付をSumDatasControllerに渡すために、
リダイレクトを使って日付をクエリパラメータとして送信します。
SampleMVCApp\Controllers\FrmController.cs
using Microsoft.AspNetCore.Mvc;
namespace SampleMVCApp.Controllers
{
public class FrmController : Controller
{
// GET: Frm
public IActionResult Index()
{
return View();
}
// POST: Frm/Submit
[HttpPost]
public IActionResult Submit(DateTime dateInput)
{
if (ModelState.IsValid)
{
// 日付をクエリパラメータとして渡す
return RedirectToAction("Index", "SumDatas", new { dateInput });
}
ViewBag.Message = "日付が無効です。";
return View("Index");
}
}
}
SampleMVCApp\Views\Frm\Index.cshtml
@{
ViewData["Title"] = "日付入力";
}
<div class="text-center">
<h1 class="display-4">日付を入力してください</h1>
<form asp-action="Submit" method="post">
<div class="form-group">
<label for="dateInput">日付:</label>
<input type="date" id="dateInput" name="dateInput" class="form-control" required />
</div>
<button type="submit" class="btn btn-primary">送信</button>
</form>
</div>
SampleMVCApp\Models\SumDatasController.cs
using Microsoft.EntityFrameworkCore;
using SampleMVCApp.Models;
using System;
using System.Linq;
using System.Threading.Tasks;
namespace SampleMVCApp.Controllers
{
public class SumDatasController : Controller
{
private readonly SampleMVCAppContext _context;
public SumDatasController(SampleMVCAppContext context)
{
_context = context;
}
// GET: SumDatas
public async Task<IActionResult> Index(DateTime? dateInput)
{
// 日付が指定されていない場合は全てのレコードを表示
var records = dateInput.HasValue
? _context.SumData.Where(r => r.UpdatedDate > dateInput.Value).ToList()
: await _context.SumData.ToListAsync();
return View(records);
}
}
}
SampleMVCApp\Views\SumDatas\Index.cshtm
@model IEnumerable<SampleMVCApp.Models.SumData>
@{
ViewData["Title"] = "Index";
}
<h1>Index</h1>
<p>
<a asp-action="Create">Create New</a>
</p>
<table class="table">
<thead>
<tr>
<th>
@Html.DisplayNameFor(model => model.Number)
</th>
<th>
@Html.DisplayNameFor(model => model.Result)
</th>
<th>
@Html.DisplayNameFor(model => model.CreatedDate)
</th>
<th>
@Html.DisplayNameFor(model => model.UpdatedDate)
</th>
<th></th>
</tr>
</thead>
<tbody>
@foreach (var item in Model) {
<tr>
<td>
@Html.DisplayFor(modelItem => item.Number)
</td>
<td>
@Html.DisplayFor(modelItem => item.Result)
</td>
<td>
@Html.DisplayFor(modelItem => item.CreatedDate)
</td>
<td>
@Html.DisplayFor(modelItem => item.UpdatedDate)
</td>
</tr>
}
</tbody>
</table>
FrmControllerから送信された日付に基づいてSumDatasControllerがレコードをフィルタリングし、その結果をビューに渡すことができるようになります。フォームが送信された後、日付を含むURLが生成され、そのURLに基づいてSumDatasControllerがレコードを表示します。
ASP.NETの参考サイト