Postback problem with partial view - asp.net-mvc

I have the following view
<form action="/Questionnaire/Submit" method="post">
<%:"UserName : "%>
<%=ViewData["UserName"]%>
<%=Html.TextBox("test",ViewData["tt"])%>
<p />
<%:"Phone Number :"%>
<%=ViewData["PhoneNumber"]%>
<p />
<%
foreach (var q in Model)
{
Html.RenderPartial("Question", q);
}
%>
<input type="submit" name="submit" value="submit" />
</form>
That render the following partial view
<% using (Html.BeginForm("Submit", "Questionnaire", FormMethod.Post))
{%>
<%:"Question Number "%>
<%=Model.QuestionNumber%>
<%:" "%>
<%=Model.Body%>
<%:" "%>
<%
foreach (var option in Model.Options)
{%>
<p/>
<%=Html.RadioButton(option.QuestionId.ToString(), (option.IsSelected) )%> <%= option.OptionBody%>
<%
}
}
%>
The problem is , The form dosn't submit , and when I remove the "foreach" statment from the master view, It works
My Objective, is to have the updated model ( from the master view and partial view ) to save it later on in DB

Your master view contains a form and then your partial view also creates a form each time it renders, so you will be left with a page containing multiple forms but only one 'Submit' button.
I'm not 100% certain what you need to do, but I'd try and remove the 'BeginForm' call from the partial and see if that fixes the problem.

Related

Model Binding issue

Using Asp.net MVC, I have one view that's strongly bind to "List" , and loop to partial render a partial view as following
<%
foreach (var q in Model)
{
Html.RenderPartial("Question", q);
}
%>
and this partial view strongly bind to "Question"
<%
foreach (var option in Model.Options)
{
%>
<p/>
<%=Html.RadioButton(option.QuestionId.ToString(), (option.IsSelected) )%> <%= option.OptionBody%>
<%
}
}
%>
Do a post back in the master view as following
<% Html.BeginForm("Submit", "Questionnaire", FormMethod.Post); %>
<input type="submit" name="submit" value="submit" />
<% Html.EndForm(); %>
Finally at my controller
[AcceptVerbs(HttpVerbs.Post)]
public ActionResult Submit(List<Question> test)
{
var x = test;
return View("Submit");
}
My Form is
<% Html.BeginForm(); %>
<%:"UserName : "%>
<%=ViewData["UserName"]%>
<%=Html.TextBox("test",ViewData["tt"])%>
<p />
<%:"Phone Number :"%>
<%=ViewData["PhoneNumber"]%>
<p />
<%
foreach (var q in Model)
{
Html.RenderPartial("Question", q);
}
%>
<% Html.EndForm(); %>
<% Html.BeginForm("Submit", "Questionnaire", FormMethod.Post); %>
<% TempData["form"] = ViewData;%>
<input type="submit" name="submit" value="submit" />
<% Html.EndForm(); %>
and when I include all in one begin form, post back dosn't fire"
My Question is
Why x is always null?
and how can I get my updated model ( having user selection to the radio button rendered in the partial view )
Should I use TempData to store my value? and how ?
After receiving the right updated model, i will save it to DB.
Thanks!
<% Html.BeginForm("Submit", "Questionnaire", FormMethod.Post); %>
<input type="submit" name="submit" value="submit" />
<% Html.EndForm(); %>
It looks to me like your form only has a single input inside of it. You need to render your editors inside the form, or they will not get included as part of the POST.
Update
So now you've got two forms: one has the inputs you want to submit and the other one has the actual button. The problem is, clicking the submit button on the second one will only submit the second (practically empty) form. Why not combine your forms?
<% Html.BeginForm("Submit", "Questionnaire", FormMethod.Post); %>
<%=ViewData["UserName"]%>
<%=Html.TextBox("test",ViewData["tt"])%>
<p />
<%:"Phone Number :"%>
<%=ViewData["PhoneNumber"]%>
<p />
<%
foreach (var q in Model)
{
Html.RenderPartial("Question", q);
}
%>
<input type="submit" name="submit" value="submit" />
<% Html.EndForm(); %>

Problem with error about model being passed into partial view

So I am trying to render a partial view into my page and I am getting the below error:
ERROR
The model item passed into the dictionary is of type
'System.Collections.Generic.List`1[GettingOrganized.Models.Todo]', but this
dictionary requires a model item of type 'GettingOrganized.Models.Todo'.
I don't see what is wrong with the partial view or controller.
PARTIAL VIEW
<%# Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl<GettingOrganized.Models.Todo>" %>
<% using (Html.BeginForm("Create", "Todo", FormMethod.Post, new {id="CreateTodo"})) {%>
<fieldset>
<legend>Fields</legend>
<div class="editor-label">
<%= Html.LabelFor(model => model.Title) %>
</div>
<div class="editor-field">
<%= Html.TextBoxFor(model => model.Title) %>
<%= Html.ValidationMessageFor(model => model.Title) %>
</div>
<p>
<input type="submit" value="Create" />
</p>
</fieldset>
<% } %>
Controller Index View that Renders the Partial View:
<% Html.RenderPartial("CreateElements"); %>
Any thoughts? I would like to keep it as close to this setup since is strong typed.
UPDATE
So to provide a few more details, now that problem is becoming more clear. I am rendering the view on the page in a div and hiding it the user clicks a certain link. Then I want to show the div. This same partial is used in a "Create" view where you can create a "Todo". But I am now wanting to use the partial in the Index view which shows a list of the model "Todo".
The model passed in, in the "Index" view:
Inherits="System.Web.Mvc.ViewPage<IEnumerable<GettingOrganized.Models.Todo>>" %>
So if I don't want to loop through a foreach loop, and just want to show one instance of the model, who do I do that?
Also I can use the following view for the partial and it will work which takes away the strongly typed to the model:
WORKING PARTIAL
<%# Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl" %>
<% using (Html.BeginForm("Create", "Todo",
FormMethod.Post, new { id="CreateTodo"})) {%>
<fieldset>
<legend>Fields</legend>
<p>
<label for="Title">Title:</label>
<%=Html.TextBox("Title")%>
<%=Html.ValidationMessage("Title", "*")%>
</p>
<p>
<input type="submit" value="Create" />
</p>
</fieldset>
<p>
<input type="submit" value="Create" />
</p>
<% } %>
Possible Answer
However, I believe I might have found an answer.
<% Html.RenderPartial("CreateElements", new Todo()); %>
Is this a proper way to handle this?
However, I believe I might have found an answer.
<% Html.RenderPartial("CreateElements", new Todo()); %>
It looks like you need to pass the model to the partial view - as in:
<% Html.RenderPartial("CreateElements", myModel); %>
I would look into how you're passing in your model into the RenderPartial:
<% Html.RenderPartial("CreateElements", model); %>
And make sure that model is of type GettingOrganized.Models.Todo.
Since you're not passing a model into your RenderPartial call, MVC is effectively trying to create one for you using the ViewDataDictionary and model from the parent page.
It looks like the parent page has a model type which is a List of ToDo items, so I guess you can just call your RenderPartial method inside of a loop; something along the lines of:
<% foreach (GettingOrganized.Models.Todo todoItem in Model) {
Html.RenderPartial("CreateElements", todoItem);
} %>

Html.BeginForm in partial for a different controller

I have the following code:
<% using (Html.BeginForm("AddComment", "Comments", FormMethod.Post)) { %>
<div id="New_Comment">
<textarea name="newComment" id="newComment">Add comments</textarea>
<input type="submit" value="Add" />
<div><span class="text_grey">Attach:</span>File Link</div>
</div>
<%} %>
This is in a partial rendered by the MyPage controller. For some reason the action on the form comes out blank, if I reference a method on the MyPage controller it works fine what I want to do is point to a different controller with my form.
To solve this issue I simple added in an area route value like so:
new { area = "" }
With the empty string directing the route to the default area.
1) Is your "Comments" action marked as being a POST action?
2) Also
Try just doing:
<% Html.BeginForm("AddComment", "Comments"); %>
// Html and script
<% Html.EndForm(); %>
I know that there shouldn't be difference between what you have and what I suggest, but it's worth a try.

MVC more than one form to submit

I have a standard Edit form view within MVC, and I need to place a user control, in this case Create inside the BeginForm, like below:
When the issue is that the Create ascx when the form is submitted does not fire it's action in the controller, what am I doing wrong?
<% using (Html.BeginForm())
{%>
<fieldset>
<legend>Tax</legend>
<p>
<label for="Name">
Name:</label>
<%= Html.TextBox("Name", Model.Tax.Name) %>
<%= Html.ValidationMessage("Name", "*") %>
</p>
<p>
<% Html.RenderAction("Create", "Mileage"); %>
</p>
<p>
<input type="submit" value="Save" />
</p>
</fieldset>
<% } %>
Here is the Create.ascx
<% using (Html.BeginForm())
{%>
<fieldset>
<p>
<label for="Distance">
Distance:</label>
<%= Html.TextBox("Distance", Model.Mileage.Distance)%>
<%= Html.ValidationMessage("Distance", "*") %><span class="field-validation-error"
id="field-validation-error-distance">*</span>
</p>
</fieldset>
<% } %>
You have nested forms in your resulting HTML. This will not work as expected. Remove the form from the inner view. The inner view will then be incomplete, so if you were using it as a stand-alone, you should make it shared, and create another view, which will just open the form, render the inner view, and close the form.
As a margin note: you are not using the default binder. You can if you want to, it will work even with nested objects (Html.TextBox("Mileage.Distance"), for example).
Nested form are not supported in HTML. See here: The FORM element
Every form must be enclosed within a FORM element. There can be several forms in a single document, but the FORM element can't be nested.
Either remove the form from your partial view and let the container view provide it, or remove the form from the view and add it to the partial thus making it independent of the parent.

PartialView renders new page instead of in div

I had this problem before and can't for life of me remember how to fix it
or where I googled about it.
I am passing back from an action a partial view
return PartialView("CommentsListControl", recipe.Comments);
But this loads a new web page and not into my div WHY?????????
<table width="100%">
<tr><td>
<div id="divComments">
<% using (Ajax.BeginForm("CreateComment", new AjaxOptions { UpdateTargetId = "divCommentsList", InsertionMode = InsertionMode.Replace }))
{ %>
<textarea id="comments" name="comments" rows="3" cols="60"></textarea>
<table width="100%"><tr><td align="right">
Save Comment
<%= Html.Hidden("recipeid", Model.RecipeID) %>
</td></tr>
</table>
<% } %>
</div>
</td></tr>
<tr><td>
<div id="divCommentsList">
<% Html.RenderPartial("CommentsListControl", Model.Comments); %>
</div>
</td></tr>
</table>
The sample you showed doesn't have a submit button on the form. In WebForms, you could use an "asp:Hyperlink" control to generate a link that looked liked it submitted a form, but that was because WebForms was implementing the JavaScript for you. In MVC you have to do that yourself. Try swapping your "Save Comment" link out for a submit button:
<input type="submit" value="Save Comment" />
Then use CSS to style the button to your hearts content.

Resources