JavaScript

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

出典: WinForms の DataGridView CellClick に慣れた業務SEが ASP.NET Razor の onclick で戸惑う3つの構造差 — 構造差3: e.RowIndex に相当するものをどう受け取るか

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

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

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

▸ 実行結果は未収録です

id: #e7d4f10828bf
lines: 7
extracted: 2026-06-10

Source収録記事

この snippet は記事の「構造差3: e.RowIndex に相当するものをどう受け取るか」セクションに登場する。コードの前後の文脈・ハマりどころの解説は記事本文で。

技術記事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

// Index.cshtml.cs — ハンドラと状態の持ち回りだけの最小形
public class IndexModel : PageModel
{
    public string? Message { get; private set; }

未収録

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

#d47e4fe2a234

図鑑トップ