会社という「体」は色々な要素で構成されています。  「顔」であるホームページ作成、「手足」となるスタッフを効率良く動かすための「神経信号」となる「共有ツール」、「エネルギー」である資金を管理するための「会計ツール」etc...  そんな「体をメンテナンス」についてお手伝いをするのが、私たちの務めです。
ASP.NET MVCを使ってみました その4

ASP.NET MVCを使ってみました その4

 

8.編集画面作成

編集画面の作成手順を簡単にまとめると、一覧画面から編集したい住所録レコードのコード値を渡し、 編集画面への遷移時アクションでDBからコード値を元にレコードを取得して、 初期表示値に設定してあげます。まず、一覧画面からコード値を渡す方法です。 下記は一覧画面のビューのコードです。

 

<td>
    <%= Html.ActionLink("Edit", "Edit", new { id=item.address_id })%> |
    <%= Html.ActionLink("Details", "Details", new { id=item.address_id })%> |
    <%= Html.ActionLink("Delete", "Delete", new { id=item.address_id })%>
</td>

 

各レコードから、各画面へ飛ぶためのリンクを作成している箇所です。引数の

1番目が表示名称、

2番目がアクション名、

3番目が次の画面に送りたいパラメータ

です。パラメータにはデフォルトでテーブルの主キーが設定されているため、この部分は変更なしでOKです。

次はコントローラの編集画面アクションです。

 

        public ActionResult Edit(int id)
        {
            // idからレコード抽出
            var addresses = (from a in _db.Address
                            where a.address_id == id
                            select a).First();

            return View(addresses);
        }

        //
        // POST: /Address/Edit/5

        [HttpPost]
        public ActionResult Edit(int id, FormCollection collection)
        {
            try
            {
                // idからレコード抽出
                var address = (from a in _db.Address
                               where a.address_id == id
                               select a).First();

                // 住所録更新
                UpdateModel(address);
                _db.SaveChanges();

                // 一覧に戻る
                return RedirectToAction("Index");
            }
            catch
            {
                // 入力に戻る
                return View();
            }
        }

 

遷移時アクションでは、以下のような順序で、DBからidを元に取得したレコードを表示値に設定しています。

1)編集前の値を取得

2)UpdateModel関数で編集前の値を取り込み

3)その値に内部で画面から入力された値を反映し登録

4)SaveChangesで登録の反映を行う

最後にビューの作成を行います。

 

 

View contentにEditと指定してください。

下記はビューのコードになります。

 

    <% using (Html.BeginForm()) { %>
        <%= Html.ValidationSummary(true) %>

        <fieldset>
            <legend>Fields</legend>

            <div class="editor-label">
                <%= Html.LabelFor(model => model.address_id) %>
            </div>
            <div class="editor-field">
                <%= Html.TextBoxFor(model => model.address_id) %>
                <%= Html.ValidationMessageFor(model => model.address_id) %>
            </div>

            <div class="editor-label">
                <%= Html.LabelFor(model => model.name) %>
            </div>
            <div class="editor-field">
                <%= Html.TextBoxFor(model => model.name) %>
                <%= Html.ValidationMessageFor(model => model.name) %>
            </div>
~中略~
            <p>
                <input type="submit" value="Save" />
            </p>
        </fieldset>

    <% } %>

 

入力項目は新規作成画面と同じになると思います。新規作成画面を部分ビューにすれば使いまわすことが可能です。

 

※参考(ビューを部品化する方法が載っています)

第2回 スキャフォールディング機能で軽々DB連携アプリケーション

 

あとはいらない項目を削ったり、好みの名称に変更すれば完了です。

→ASP.NET MVCを使ってみました その5

コメントを残す

メールアドレスが公開されることはありません。

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください