0

MVC4 ビューで 1 つの Ajax.BeginForm を使用して複数のアクションを呼び出す方法 (可能であれば) を誰かに説明してもらえますか? 私がやろうとしていることを説明しましょう。私のビューには、コントローラーに 2 つのパラメーターを提供するフォームがあります。このビューには、フォームが送信されたときに更新する 4 つの部分ビューもあります。各アクションは、ページの 4 つのセクションを更新する部分ビューを返します。

私が理解していることから、各 Ajax.BeginForm はコントローラーで 1 つのアクションのみを呼び出すことができます。フォームのボタンをクリックして、ページの 4 つの部分ビューを更新する最良の方法は何ですか?

これが私の見解です。

  <div id="dayTab" data-metro-container="dashboardForm">
  @using (Ajax.BeginForm("Products", "Dashboard", new AjaxOptions { UpdateTargetId="ProductsDiv", OnComplete = "processDay" }))
  {
    <table>
        <tr>@Html.ValidationSummary()</tr>
        <tr>
            <td>@Strings.LabelDashboardDate :
            </td>
            <td>
                @Html.HiddenFor(model => model.DateRangeFilter)
                @Html.TextBoxFor(model => model.DateRangeCriteria, new { @class = "dateRangeClass" })
            </td>
            <td>
                <input id="btnApply" type="submit" name="btnApply" value="@Strings.LabelApply" title="@Strings.TooltipDashboardApply" />
            </td>
            <td>
                <span class="customNoWrap" data-metro-spinner="spinner" style="display: none;">
                    <img src="@ConfigurationCache.Settings.CSSPath/Content/themes/metro/Images/loading.gif")" alt="" class="metroCenterTag"/>
                </span>
            </td>
        </tr>
    </table>
  }

<div style="float:left;">
    <div id="ProductsDiv">
        @{ Html.RenderAction("Products"); }
    </div>
    <div id="QuantitiesDiv" style="height: 200px;">
        @{ Html.RenderAction("Quantities"); }
    </div>            
</div>

<div style="float: left;">
    <div id="PurchaseOrdersDiv" style="margin-left: 10px;">
      @{ Html.RenderAction("PurchaseOrders"); }
    </div>
    <div id="BoxesDiv" style="margin-left: 10px;">
      @{ Html.RenderAction("Boxes"); }
    </div>
    <div id="PalletsDiv" style="margin-left: 10px;">
      @{ Html.RenderAction("Pallets"); }
    </div>
</div>

<div style="clear: both"></div>

実際、jQuery タブには 4 つのタブがあり、各タブは同じ構造、同じ部分ビューを持っています。フォームを送信して、現在のタブの 4 つの部分ビューを更新する必要があります。

4

2 に答える 2

0

あなたのajaxの唯一の目的は、サーバーにフィルター基準を設定することであるように見えるので、他の4つの部分ビューはそれらを使用してそれに応じてレンダリングできます。

Ajax を使用して呼び出しているアクションが、必要なすべてのマークアップを返して、コンテナーを更新できるようにしないのはなぜですか? ajax を使用してアクションを呼び出すと、ここで必要な 4 つの部分ビューを含む部分ビューをレンダリングできます。つまり、私見はよりシンプルで明確です。

とにかくやりたいことができる。配管を変更できない場合は、次の方法を実行できます。

1) Ajax オプションで成功のハンドラーを指定します。

@using (Ajax.BeginForm("YourAction", "YourController", new AjaxOptions
            {
                HttpMethod = "Post",
                OnSuccess = "LoadPartialViews()"
            }

2) 各部分コンテナをそれぞれの URL で装飾します。

<div id="ProductsDiv" data-url="@Url.Action("Products")">
    @{ Html.RenderAction("Products"); }
</div>

//and so on for the rest of the partials

3) OnSuccess LoadPartialViews() が呼び出され、次のようになります。

var LoadPartialViews = function (){
    var productsUrl = $("#ProductsDiv").data("url");
    //this will load the partial view content on the div... 
    $("#ProductsDiv").load(productsUrl, function(){});
};

繰り返しますが、このすべてのレンダリングを 1 つのアクションで実行する方が良いと確信しています。最初のロードでは、いつでもいくつかのデフォルトを想定してアクションを起動できるため、初期コンテンツを取得できます。

これが役立つことを願っています。

于 2013-09-15T05:59:49.127 に答える
0

Ajax.BeginForm でロジックを絞り込む方法を説明する代わりに、ASP.NET MVC で非常にうまく機能するhttp://knockoutjs.com/を確認することをお勧めします。いくつかのページ要素が依存しているデータがある場合、KnockoutJS を使用すると、基になる依存データが変更されたときにビュー要素を更新できるため、より効果的に作業を行うことができます。また、それが自動的に行われます。1〜2時間かかる素晴らしいオンラインチュートリアルがあり、非常に詳細です.

于 2013-09-15T07:04:19.597 に答える