Saturday, 14 September 2013

ajax.beginform to call many actions

ajax.beginform to call many actions

Can someone explain to me how (if possible) to call multiple actions using
one Ajax.BeginForm in an MVC4 view? Let me explain what I'm trying to do.
I have a form in my view that provides two parameters to the Controller.
In this view I also have four partial views to update when the form is
submitted. Each action returns a partial view that updates the 4 sections
of the page.
From what I understand, each Ajax.BeginForm can call one and only one
action on the Controller. What is the best way to update four partial
views on a page at the click of a button in the form?
Here is what my view looks like.
<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>
I actually have four tabs in a jQuery tab and each tab has the same
structure, same partial views. The form has to be submitted and updates
the 4 partial views in the current tab.

No comments:

Post a Comment