1

その上のドロップダウン リストから選択した値に基づいて、「ConditionalAnalysisInput」を初期化する必要があります。そのためには にアクセスする必要がありますdbset。

ConditionalAnalysisInput フィールドを初期化する最良の方法は何ですか?

ビューコードは次のとおりです。

@using (Ajax.BeginForm("_ListConditionalAnalysis",
                    new AjaxOptions { UpdateTargetId = "_conditionals",
                                      InsertionMode = InsertionMode.InsertAfter}))
{
        @Html.DropDownListFor(model=>model.AvailableConstructs,Model.AvailableConstructs)
    <p>
        <input type="submit" value="Populate" />
    </p>
}
<div id="_conditionals">
  @*** Need to init ConditionalAnalysisInput here depending on the selected value from the dropdown list. Access to dbset needed *@
   @foreach (var item in Model.ConditionalAnalysisInput)
   {
       @Html.Partial("_ListConditionalAnalysis",item)
   }
</div>
4

1 に答える 1

2

次のセクションで必要な新しいモデルデータを取得するには、サーバーへのコールバックを実行する必要があります。モデルの初期化（およびデータベースへの接続）はサーバー側の責任であり、クライアントで直接処理することはできません。

選択したアイテムを取得して、処理する必要のあるConditionalAnalysisInputオブジェクトのリストを返すアクションを作成します。ドロップダウンリストが変更されるたびに、AJAX呼び出しを発行して新しいデータを取得し、_conditionalsdivを更新します。

これは非常に単純化されており、クリーンアップせずにそのまま通過する必要があるものではないという通常の免責事項を使用して、私が意味することを示すために一緒に投げた簡単な例を次に示します。

私は2つのテストモデルを持っていますが、それらは明らかに単純化されています。1つ目は、最初にWebページに必要なすべてのデータ（つまり、ドロップダウンリスト）用です。2番目のモデルは部分ビュー用であり、ドロップダウンリストから選択したアイテムによって異なります。

public class DropDownModel
{
    public IEnumerable<string> DropDownOptions
    {
        get;
        set;
    }

    public DropDownModel()
    {
    }

    public DropDownModel(IEnumerable<string> dropDownOptions)
    {
        DropDownOptions = dropDownOptions;
    }
}

public class ConditionalsModel
{
    public IEnumerable<string> ConditionalAnalysisInput
    {
        get;
        set;
    }

    public ConditionalsModel()
    {
    }

    public ConditionalsModel(string selectedOption)
    {
        if (selectedOption == "Option A")
        {
            ConditionalAnalysisInput = new List<string>
            {
                "Input A 1",
                "Input A 2",
                "Input A 3"
            };
        }
        else if (selectedOption == "Option B")
        {
            ConditionalAnalysisInput = new List<string>
            {
                "Input B 1",
                "Input B 2",
                "Input B 3"
            };
        }
    }
}

次にコントローラー。メインアクションは、メインモデルにデータを入力し、ビューを返します。また、選択したアイテムをパラメーターとして受け取り、PartialViewResultを返す2番目のメソッドを追加する必要があります。

public class AjaxTestController：Controller {// // GET：/ AjaxTest / public ActionResult Index（）{var model = new DropDownModel（new List {"Option A"、 "Option B"}）; ビュー（モデル）;を返します。}

    public PartialViewResult GetDataForDiv(string selectedOption)
    {
        var model = new ConditionalsModel(selectedOption);
        return PartialView("Conditionals", model);
    }
}

_conditionalsdivに表示するすべてのマークアップを含む「Conditionals」部分ビューを作成します。

@model TestMvcProgram.Models.ConditionalsModel

<ul>
@foreach (var item in Model.ConditionalAnalysisInput)
{
    <li>@item</li>
}
</ul>

メインビューで、DropDownListの変更イベントのハンドラーを追加します。変更イベント中に、サーバーにget要求を発行してGetDataForDivメソッドを呼び出し、結果の部分ビューで_conditionalsdivを更新できます。これが私の例です：

@model TestMvcProgram.Models.DropDownModel

@{
    Layout = "~/Views/Shared/_Layout.cshtml";
}

<!DOCTYPE html>

<html>
    <head>
        <title>title</title>
    </head>
    <body>
        <div>
            @Html.DropDownList("selectedOption", Model.DropDownOptions.Select(x => new SelectListItem { Selected = false, Text = x, Value = x }), new {id = "selectedOption"})

            <div id="_conditionals"></div>
        </div>

        <script type="text/javascript" language="javascript">
            $(function () {
                $('#selectedOption').change(function () {
                    $.get('@Url.Action("GetDataForDiv", "AjaxTest")' + "?selectedOption=" + $(this).val(), function(data, textStatus, jqXHR) {
                        $("#_conditionals").html(data);
                    });
                });
            });
        </script>
    </body>
</html>
于 2012-08-13T20:03:42.887 に答える