ドロップダウンオプションが変更されたときにテーブルを更新する

Question

私の値はドロップダウンリストの値に依存するテーブルの一部を持っています。ドロップダウンリストの選択されたオプションが変更されたときにテーブルを更新するにはどうすればよいですか。

グリッド

@foreach (var choice in ViewData.Model.Options where choiceId == ViewData.Model.choiceLevelId) 
        { 
         <tr class='gridrow'> 
          <td>..... 

ドロップダウン何のことをいっているのテーブル

<div class="editor-field"> 
       @Html.DropDownListFor(model => model.choiceLevelId, 
          (
          ... 

Answer 1

？ ASP.NET MVCにはテーブルやチェアの知識はありません。これは、モデル、コントローラ、およびビューで動作します。

<select>ボックスをレンダリングしたビューがあり、ユーザーがこの選択ボックスの値を変更して、コントローラアクションを呼び出すときに、新しく選択した値をサーバーに渡して、処理。私は正しい？

このドロップダウンの変更イベントを購読するには、ビューでjavascriptを使用する必要があります。次に、あなたはいくつかの可能性を持っています：

• 選択した値をサーバーに送信するために、AJAX要求を使用します。
• 現在のブラウザを（window.location.hrefを使用して）コントローラのアクションにリダイレクトし、選択した値をアクション引数として渡します。

要件に応じて、最適な方法を選択することができます。

私はjQueryのを使用しての例で最初のアプローチを説明してみましょう：

<script type="text/javascript"> 
    $(function() { 
     // subscribe to the .change event of the dropdowns 
     $('select').change(function() { 
      // fetch the newly selected value 
      var selectedValue = $(this).val(); 
      // send it as an AJAX request to some controller action 
      $.post('@Url.Action("Foo")', { value: selectedValue }, function(result) { 
       // this will be invoked in the case of success of the AJAX call 
       // TODO: do something with the results returned by the controller action 
      }); 
     }); 
    }); 
</script> 

とAJAX要求を処理するあなたのコントローラのアクション：

[HttpPost] 
public ActionResult Foo(string value) 
{ 
    // this action will be invoked when the user changes the selection 
    // in one of the dropdown lists and passed the newly selected value. 
    // So using this new value you could perform the desired processing 
    // on your model here and return a view. Since this action was invoked 
    // with an AJAX call you could return a JSON string to the client indicating 
    // the success or failure of whatever processing you were intending to perform 
    // here 

    ... 

} 

---

UPDATE：

選択肢が変更されたときにドロップダウンを含むフォームを送信したい場合は、次のものを使用してください：

<script type="text/javascript"> 
    $(function() { 
     // subscribe to the .change event of the dropdowns 
     $('select').change(function() { 
      // trigger the submission of the containing form: 
      $(this).closest('form').submit(); 
     }); 
    }); 
</script>