ASP.Net CoreのRagor PagesでWindows FormのDataGridViewのように、データを一覧表示した状態で、更新処理をかけられないかなと思いまして、いろいろ調べてみたのですが、なかなかそれらしい記事に出会えず...ChatGPTの力を借りたりしながら、やっと分かりましたので共有です!
データの更新については触れていませんが、PageModelクラスに変更(入力)情報はListで伝搬しています。ステップ実行で止めると、Itemsプロパティが更新されます。
このあたり、MSのチュートリアルに載せて広めてほしい感じもするのですが...世間的にあまり需要ないのでしょうか。。
@page
@model SampleTableInput.Pages.TableInputModel
@{
}
<form class="form" method="post">
<table class="table">
<thead>
<tr>
<th>ID</th>
<th>名前</th>
</tr>
</thead>
<tbody>
@for (int i = 0; i < Model.Items.Count; i++)
{
<tr>
<td >
<input type="text" class="form-control my-0 py-0" asp-for="Items[i].Id">
</td>
<td >
<input type="text" class="form-control my-0 py-0" asp-for="Items[i].Name">
</td>
</tr>
}
</tbody>
</table>
<br>
<input type="submit" value="送信" class="btn btn-secondary" asp-page-handler="Post" />
</form>
using Microsoft.AspNetCore.Mvc;
using Microsoft.AspNetCore.Mvc.RazorPages;
namespace SampleTableInput.Pages
{
public class TableInputModel : PageModel
{
[BindProperty]
public List<Item> Items { get; set; } = default!;
public void OnGet()
{
// 初期データを設定
Items =
[
new Item { Id = 1, Name = "Item1" },
new Item { Id = 2, Name = "Item2" },
new Item { Id = 3, Name = "Item3" }
];
Console.WriteLine("OnGet Count = " + Items.Count);
}
public void OnPost()
{
Console.WriteLine("OnPost Count = " + Items.Count);
}
}
public class Item
{
public int Id { get; set; }
public string Name { get; set; } = "";
}
}