ミニマム検証 — 最小の Razor onclick を動かす

出典: WinForms の DataGridView CellClick に慣れた業務SEが ASP.NET Razor の onclick で戸惑う3つの構造差 — ミニマム検証 — 最小の Razor onclick を動かす

ミニマム検証 — 最小の Razor onclick を動かす (csharp)#d47e4fe2a234

// Index.cshtml.cs — ハンドラと状態の持ち回りだけの最小形
public class IndexModel : PageModel
{
    public string? Message { get; private set; }
 
    public void OnGet() { }                   // 初回表示
    public void OnPostSelect(int id)          // ボタン押下時
    {
        Message = $"選択された行ID: {id}";    // この値はこのリクエスト内だけ生きる
    }
}

▸ この snippet は実行結果未収録

▸ 実行結果は未収録です

id: #d47e4fe2a234
lines: 11
extracted: 2026-06-10

Source収録記事

この snippet は記事の「ミニマム検証 — 最小の Razor onclick を動かす」セクションに登場する。コードの前後の文脈・ハマりどころの解説は記事本文で。

技術記事ASP.NETDataGridView

WinForms の DataGridView CellClick に慣れた業務SEが ASP.NET Razor の onclick で戸惑う3つの構造差

2週間前13 min

同じ記事から

4 件

// WinForms: クリックは同一プロセス内で即ハンドラが呼ばれる
private void dataGridView1_CellClick(object sender, DataGridViewCellEventArgs e)
{
    if (e.RowIndex < 0) return;                 // ヘッダクリックは除外

未収録

構造差1: イベントはサーバへ往復する

#69c5b317cca3

// PageModel: POST されて初めてサーバ側ハンドラが動く
public class IndexModel : PageModel
{
    public IActionResult OnPostSelect(int id)   // 引数で行IDを受け取る

未収録

構造差1: イベントはサーバへ往復する

#b5896e34500d

// 状態の持ち回り方(用途で使い分け)
TempData["Message"] = msg;     // 次の1リクエストだけ持たせる(PRG とセット)
HttpContext.Session.SetInt32("SelectedId", id);  // セッション中ずっと
// または、毎回 DB / hidden から復元する(いちばん素直)

未収録

構造差2: ページは毎回作り直される

#88dea1d0cff9

JavaScript

// JS で完結させる場合: data-id を読んで fetch で送る
document.querySelectorAll(".row-btn").forEach(btn => {
  btn.addEventListener("click", async () => {
    const id = btn.dataset.id;            // e.RowIndex の代わりに data-id

未収録

構造差3: e.RowIndex に相当するものをどう受け取るか

#e7d4f10828bf

図鑑トップ