サブミットMVC 3で入力値を取得

Question

デフォルトのMVC 3アプリケーションをセットアップしましたが、これは初めてですが、入力フィールドから値を印刷しようとしているときに問題があります。送信ボタンをクリックしました。

これは、下部に送信ボタンがある単純な登録フォームです。送信ボタンをクリックすると、入力フィールドの1つからのテキストが、送信ボタンの下にあるラベルまたは何かに印刷されることが予想されます。私はこれを行う方法を完全に失っています、私はIDを持つラベルを作成しようとしましたが、私は入力フィールドの値またはラベルにアクセスすることができません。

コントローラのアクションは、次のようになります。完全な形は次のようになります

[HttpPost] 
     public ActionResult Create(Person person) 
     { 
      if (ModelState.IsValid) 
      { 
       db.Persons.Add(person); 
       db.SaveChanges(); 
       return RedirectToAction("Index"); 
      } 

      return View(person); 
     } 

：投稿フォームからのすべての値を取得するために

@using (Html.BeginForm()) 
{ 
    @Html.ValidationSummary(true) 
    <fieldset> 

     <div class="editor-label"> 
      @Html.LabelFor(model => model.Firstname) 
     </div> 
     <div class="editor-field"> 
      @Html.EditorFor(model => model.Firstname) 
      @Html.ValidationMessageFor(model => model.Firstname) 
     </div> 

     <div class="editor-label"> 
      @Html.LabelFor(model => model.Lastname) 
     </div> 
     <div class="editor-field"> 
      @Html.EditorFor(model => model.Lastname) 
      @Html.ValidationMessageFor(model => model.Lastname) 
     </div> 

     <div class="editor-label"> 
      @Html.LabelFor(model => model.Email) 
     </div> 
     <div class="editor-field"> 
      @Html.EditorFor(model => model.Email) 
      @Html.ValidationMessageFor(model => model.Email) 
     </div> 

     <div class="editor-label"> 
      @Html.LabelFor(model => model.Phone) 
     </div> 
     <div class="editor-field"> 
      @Html.EditorFor(model => model.Phone) 
      @Html.ValidationMessageFor(model => model.Phone) 
     </div> 
     <p> 
      <button id="btn_Register"> 
       <span class="ui-button-text">Register</span> 
      </button> 
     </p>    
    </fieldset> 
} 

Answer 1

、彼らはあなたの例では（となります）内にあります。personオブジェクト内です。

ラベルに値を出力するには、personオブジェクトを新しい値で変更し、次にこの値を[出力]に出力する必要があります。

person.labelvalue = "foo"; 

<span>@model.labelvalue</span> 

私が得る、

Answer 2

MVC ASP.NETするasp.netから移動する前に、送信ボタン上のコントローラに移動する方法を持つことができますが、開始ベースとしてasp.net/mvcを見てみましょう示唆フィールド値を入力して、ラベルを表示するように設定します。しかし、ボタンをクリックするだけでラベルのテキストを設定すれば、サーバー側のコードがなくてもMVCコードを記述する必要はありません。送信ボタンの代わりに単純なボタンを使用するだけです。ボタンクリックのためのJavaScript/jQueryイベント/関数を記述し、必要な入力フィールドからラベルテキストを設定します。何かのように...

$("#fooLabel").text($("#fooTextEditor").val()); 

これを行うには、これら2つのコントロールのIDを知る必要があります。何内蔵の過負荷Html.EditorForまたは@ Html.LabelFor @使用してフィールドにIDを提供することがないように、この記事で提案されているように、あなたは..あなたは、任意のブラウザを使用することができます How to specify ID for an Html.LabelFor<> (MVC Razor)

、あるいは単純にHtmlHelperの上書きしますかdevツールを使用して、2つのコントロールの生成されたIDを見つけ、JaveScript/jQueryで直接使用します。通常はモデルフィールド名と同じです。

Answer 3

ページやその他のアクションを送信しないようにするには、JavaスクリプトまたはJqueryを使用してクライアント側でこの操作を実行する必要があります。 Javaスクリプトでは、btn_Registerボタンにonclickイベントを追加し、ラベルの値をテキストフィールドに設定します。クリックイベントでjqueryを使用している場合は、次の値を割り当ててください

btn_Register.click(function(){ 
    $("#label1").text($('txtfield1').val()); 
});