Luis Hernandez Luis Hernandez - 1 year ago 47
C# Question

Get values in controller from two partial views in MVC

I have a view (razor, mvc4) with a button, inside this there are two partial views. They are strongly typed. The partials contain a button and some input fields each.

<div>
@{Html.RenderPartial("_LinkCreator", Model.linkCreator);}
</div>
<br />
<div>
@{Html.RenderPartial("_LinkFinder", Model.linkFinderImage);}
</div>


The main view has a model

@model mvcPictureDownload.Models.PictureDownloadModel


Inside the controller I have an action result

[HttpPost]
public ActionResult LinkDownload(PictureDownloadModel pictureDownload,
LinkCreatorModel linkCreator, LinkFinderModel linkFinderImage)


If I clic the button inside one of the partial views, the controller catch the values from this partial, but i get null values from the input fields of the other partial view. If i clic the button on the main view, only the values from the first partial view are passed to the controller.

I need the values from both partial views at once in my controller. Is there a way to do this ?

Edit:
The partial views looks like this

@model mvcPictureDownload.Models.LinkFinderModel
<script src="~/Scripts/jquery-1.7.1.min.js"></script>
<script src="~/Scripts/jquery.validate.min.js"></script>
<script src="~/Scripts/jquery.validate.unobtrusive.min.js"></script>
@using (Html.BeginForm()) {
@Html.ValidationSummary(true)

<fieldset>
<legend>LinkFinderModel</legend>
<div class="container">
<div class="row" >
<div class="col-md-12">
<div class="editor-label">
@Html.LabelFor(model => model.file)
</div>
<div class="editor-field">
@Html.TextBoxFor(model => model.file, new { @class = "input-full" })
@Html.ValidationMessageFor(model => model.file)
</div>
</div>
</div>
<div class="row" >
<div class="col-md-4">
<div class="editor-label">
@Html.LabelFor(model => model.tagSearchExpression)
</div>
<div class="editor-field">
@Html.TextBoxFor(model => model.tagSearchExpression, new { @class = "input-full" })
@Html.ValidationMessageFor(model => model.tagSearchExpression)
</div>
</div>
<div class="col-md-4">
<div class="editor-label">
@Html.LabelFor(model => model.attributeSearchExpression)
</div>
<div class="editor-field">
@Html.TextBoxFor(model => model.attributeSearchExpression, new { @class = "input-full" })
@Html.ValidationMessageFor(model => model.attributeSearchExpression)
</div>
</div>
<div class="col-md-4">
<div class="editor-label">
@Html.LabelFor(model => model.folderSearchExpression)
</div>
<div class="editor-field">
@Html.TextBoxFor(model => model.folderSearchExpression, new { @class = "input-full" })
@Html.ValidationMessageFor(model => model.folderSearchExpression)
</div>
</div>
</div>
<div class="row" >
<div class="col-md-2">
<div class="editor-label">
@Html.LabelFor(model => model.linkType)
</div>
<div class="editor-field">
@Html.TextBoxFor(model => model.linkType, new { @class = "input-full" })
@Html.ValidationMessageFor(model => model.linkType)
</div>
</div>
<div class="col-md-2">
<div class="editor-label">
@Html.LabelFor(model => model.requiredText)
</div>
<div class="editor-field">
@Html.TextBoxFor(model => model.requiredText, new { @class = "input-full" })
@Html.ValidationMessageFor(model => model.requiredText)
</div>
</div>
<div class="col-md-2">
<div class="editor-label">
@Html.LabelFor(model => model.avoidText)
</div>
<div class="editor-field">
@Html.TextBoxFor(model => model.avoidText, new { @class = "input-full" })
@Html.ValidationMessageFor(model => model.avoidText)
</div>
</div>
<div class="col-md-2">
<div class="editor-label">
@Html.LabelFor(model => model.ReplaceThis)
</div>
<div class="editor-field">
@Html.TextBoxFor(model => model.ReplaceThis, new { @class = "input-full" })
@Html.ValidationMessageFor(model => model.ReplaceThis)
</div>
</div>
<div class="col-md-2">
<div class="editor-label">
@Html.LabelFor(model => model.ReplaceWith)
</div>
<div class="editor-field">
@Html.TextBoxFor(model => model.ReplaceWith, new { @class = "input-full" })
@Html.ValidationMessageFor(model => model.ReplaceWith)
</div>
</div>
</div>
<br />
<p>
<input type="submit" value="Apply" name="FinderButton" />
</p>
</div>
</fieldset>}


The main view is this

@model [email protected]{
ViewBag.Title = "LinkDownload";}
<h4>LinkDownload</h4>

@using (Html.BeginForm())
{
@Html.ValidationSummary(true)

<fieldset>
<legend>PictureDownloadModel</legend>

<p>
<input type="submit" value="Create" name="CreateButton" />
</p>
</fieldset>

<div>
@{Html.RenderPartial("_LinkCreator", Model.linkCreator);}
</div>
<br />
<div>
@{Html.RenderPartial("_LinkFinder", Model.linkFinderImage);}
</div>

<fieldset>
<div class="container">
<div class="row" >
<div class="col-md-12">
<div class="editor-label">
@Html.LabelFor(model => Model.FilePath)
</div>
<div class="editor-field">
@Html.TextBoxFor(model => Model.FilePath, new { @class = "input-full" })
@Html.ValidationMessageFor(model => Model.FilePath)
</div>
</div>
</div>
<br /><br />
<div class="row" >
<div class="col-md-12">
<div style="height:200px;overflow:auto;">
@foreach (var createRes in Model.linkCreatorResult)
{
<li><b>@createRes</b></li>
}
</div>
</div>
</div>
</div>
@Html.HiddenFor(model => Model.linkCreatorResult)
</fieldset>}@section Scripts {
@Scripts.Render("~/bundles/jqueryval")}

Answer Source

As I can see each of partial view contains the form. So when you click submit button browser submits the form on which this button was placed. Other inputs on the other form are not being submitted. Just remove FORM tag from your partial and keep it on your main view.

In your partial you don't need to have @Html.BeginForm(). And by the way when you place FORM tag inside a partial view make sure it won't be wrapped by another FORM in main view or you will have invalid HTML.

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download