ASP.NET POSTで値を別画面に渡すサンプル

ASP.NETとVB.NETでフォームの値を別画面に渡すサンプルです。

確認環境
・Microsoft Visual Studio Community 2019

説明	画面表示までの流れ
コード	値を送信する側のファイル(view1.vbhtml)
	コントローラのクラス(test1Controller.vb)
	値を受け取る側のファイル(view2.vbhtml)

画面表示までの流れ

画面表示までの流れは、以下のとおりです。

１．ブラウザでコントローラ(test1Controller.vb)にアクセス→ビュー1(view1.vbhtml)をブラウザに返す。

２．ビュー1(Index.vbhtml)で値を入力して送信ボタンを押す→コントローラ(test1Controller.vb)にアクセスする。

３．コントローラ(test1Controller.vb)は、ビュー2(view2.vbhtml)をブラウザに返す。

ファイル構造は以下のようになります。

初期に表示される画面の設定

初期に表示される画面は以下の手順で設定します。

１．プロジェクト(ここではasp-3)を右クリックします。

２．一番下のプロパティをクリックします。

３．「Web」をクリックし、「URLの開始」に「https://localhost:44373/test1」と入力し、ctrl + sで保存します。
※ポート番号は各環境で異なります。

上記の設定で、ブラウザからhttps://localhost:44373/test1にアクセスするとtest1Controllerのindexから処理が開始します。

値を送信する側のファイル(view1.vbhtml)

値を送信する側のファイルです。

@Code
  ViewData("Title") = "view1"
End Code
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width" />
  <title>Index</title>
</head>
<body>
  <form method="post" action="test1/TestForm">
    <input type="text" name="text1">
    <input type="submit" value="送信ボタン">
  </form>
</body>
</html>

12行目は、methodでpost方式を指定し、actionで送信先を指定しています。
→test1は、test1Controllerコントローラの先頭部分の文字を表します。
→TestFormは、test1ControllerコントローラのFunction名です。
13行目は、テキストボックスです。画面から文字を入力します。
14行目は、送信ボタンです。ボタンを押すとsubmitします。

画面イメージ

上記コードの画面イメージです。

コントローラのクラス(test1Controller.vb)

コントローラのクラスです。

Imports System.Web.Mvc

Namespace Controllers
    Public Class test1Controller
        Inherits Controller

        ' GET: test1
        Function Index() As ActionResult
            Return View("view1")
        End Function

        Function TestForm() As ActionResult
            ViewBag.test1 = Request.Form("text1")
            Return View("view2")
        End Function
    End Class
End Namespace

8行目は、Indexのファンクションです。設定で画面表示時にここから始まるようにしました。
9行目のview1は、view1.vbhtmlを表示します。

12行目は、TestFormのファンクションです。view1.vbhtmlのactionで指定された名称です。
13行目のRequest.Form("text1")は、リクエストパラメータを受け取ります。
"text1"はview1.vbhtmlのフォームの中にあるnameの値です。
取得した値は、ViewBagにセットしています。
14行目のview2は、view2.vbhtmlを表示します。

値を受け取る側のファイル(view2.vbhtml)

値を受け取る側のファイルです。

@Code
  ViewData("Title") = "view1"
End Code
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width" />
  <title>Index</title>
</head>
<body>
  遷移先の画面です：値は、「@ViewBag.test1」です。
</body>
</html>

12行目は、@ViewBagで、コントローラから渡された値を表示します。