Html.DisplayFor not posting values to controller in ASP.NET MVC 3 - asp.net-mvc

I am using ASP.NET MVC 3 with Razor, below is a sample from my view code.
The user should be able to edit all their details, except the "EmailAddress" field. For that field only I have used Html.DisplayFor(m => m.EmailAddress).
But when this form gets posted, all the model properties are filled except the EmailAddress.
How do I get the email back in the model when posting? Should I have used some helper other than DisplayFor?
#using (Html.BeginForm()) {
#Html.ValidationSummary(true, "Account update was unsuccessful. Please correct any errors and try again.")
<div>
<fieldset>
<legend>Update Account Information</legend>
<div class="editor-label">
#Html.LabelFor(m => m.EmailAddress)
</div>
<div class="editor-field">
#Html.DisplayFor(m => m.EmailAddress)
#*#Html.ValidationMessageFor(m => m.EmailAddress)*#
</div>
<div class="editor-label">
#Html.LabelFor(m => m.FirstName)
</div>
<div class="editor-field">
#Html.TextBoxFor(m => m.FirstName)
#Html.ValidationMessageFor(m => m.FirstName)
</div>
<div class="editor-label">
#Html.LabelFor(m => m.LastName)
</div>
<div class="editor-field">
#Html.TextBoxFor(m => m.LastName)
#Html.ValidationMessageFor(m => m.LastName)
</div>
<p>
<input type="submit" value="Update" />
</p>
</fieldset>
</div>
}
Please advise me on this.

you'll need to add a
#Html.HiddenFor(m => m.EmailAddress)
DisplayFor won't send anything in POST, it won't create an input...
By the way, an
#Html.HiddenFor(m => m.Id) // or anything which is the model key
would be usefull

Related

MultiSubmitButton Clientside validation

I have created one View. In that i have put 2 Multisubmit buttons for "create" and "cancel".
Now, on cancel click, clientside validation is going to call. but I don't want to call clientside validations.
I have written code as below, please check it. I don't want validations to be executed on cancel button click.
#model Blog.Models.User
#{
ViewBag.Title = "Register New User";
}
#using Microsoft.Web.Mvc;
#using MVC3MultiSubmitButtonExtension;
<h2>
Register New User</h2>
<script src="#Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"></script>
<script src="#Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script>
#using (Html.BeginForm())
{
#Html.ValidationSummary(true)
<fieldset>
<legend>Fill User Details</legend>
<div class="editor-label">
#Html.LabelFor(model => model.FirstName)
</div>
<div class="editor-field">
#Html.EditorFor(model => model.FirstName)
#Html.ValidationMessageFor(model => model.FirstName)
</div>
<div class="editor-label">
#Html.LabelFor(model => model.LastName)
</div>
<div class="editor-field">
#Html.EditorFor(model => model.LastName)
#Html.ValidationMessageFor(model => model.LastName)
</div>
<div class="editor-label">
#Html.LabelFor(model => model.Username)
</div>
<div class="editor-field">
#Html.EditorFor(model => model.Username)
#Html.ValidationMessageFor(model => model.Username)
</div>
<div class="editor-label">
#Html.LabelFor(model => model.Password)
</div>
<div class="editor-field">
#Html.EditorFor(model => model.Password)
#Html.ValidationMessageFor(model => model.Password)
</div>
<div class="editor-label">
#Html.LabelFor(model => model.EmailAddress)
</div>
<div class="editor-field">
#Html.EditorFor(model => model.EmailAddress)
#Html.ValidationMessageFor(model => model.EmailAddress)
</div>
<div class="editor-label">
#Html.LabelFor(model => model.MobileNumber)
</div>
<div class="editor-field">
#Html.EditorFor(model => model.MobileNumber)
#Html.ValidationMessageFor(model => model.MobileNumber)
</div>
<p>
#* <input type="submit" value="Create" />*#
#Html.MultiSubmitButton(Url.Action("Create"), "btnCreate", "Create")
#Html.MultiSubmitButton(Url.Action("Cancel"), "btnCancel", "Cancel")
</p>
</fieldset>
}
<div>
#Html.ActionLink("Click here to go Login Page", "Index")
</div>
If you assign class="cancel" to your cancel submit button, clientside validation won't run. The way you assign this class is not something that I can tell as you seem to be using some custom helper Html.MultiSubmitButton which is not part of ASP.NET MVC. So you will have to check its documentation.

How can insert fix value in a field when creating a new row

I am working on asp.net mvc3. I have designed database in SQL Server. And I access database using ado.net, I am designing a "CREATE" page.
This is my view.cshtml
#model CalcoWOMS.Models.ProductFormulation
#{
ViewBag.Title = "doProductFormulation";
Layout = "~/Views/Shared/_Layout.cshtml";
}
<script src="#Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"></script>
<script src="#Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script>
#using (Html.BeginForm()) {
#Html.ValidationSummary(true)
<fieldset>
<legend>ProductFormulation</legend>
<div>
#Html.EditorFor(model => model.ProductID) <!-- i want to insert fix value (100) in this ProductID field in ProductFormulation Table -->
#Html.ValidationMessageFor(model => model.ProductID)
</div>
<div class="editor-label">
#Html.LabelFor(model => model.RawMaterialID)
</div>
<div class="editor-field">
#Html.DropDownList("RawMaterialID","SELECT")
#Html.ValidationMessageFor(model => model.RawMaterialID)
</div>
<div class="editor-label">
#Html.LabelFor(model => model.Code)
</div>
<div class="editor-field">
#Html.EditorFor(model => model.Code)
#Html.ValidationMessageFor(model => model.Code)
</div>
<div class="editor-label">
#Html.LabelFor(model => model.Description)
</div>
<div class="editor-field">
#Html.EditorFor(model => model.Description)
#Html.ValidationMessageFor(model => model.Description)
</div>
<div class="editor-label">
#Html.LabelFor(model => model.MinimumBatchSize)
</div>
<div class="editor-field">
#Html.EditorFor(model => model.MinimumBatchSize)
#Html.ValidationMessageFor(model => model.MinimumBatchSize)
</div>
<div class="editor-label">
#Html.LabelFor(model => model.Quantity)
</div>
<div class="editor-field">
#Html.EditorFor(model => model.Quantity)
#Html.ValidationMessageFor(model => model.Quantity)
</div>
<p>
<input type="submit" value="Create" />
</p>
</fieldset>
}
<div>
#Html.ActionLink("Back to List", "ProductFormulationIndex")
</div>
I want to insert fixed value (100) in this ProductID field in ProductFormulation table and don't want to create editable box. What should I
do for this ?
Perhaps I don't understand the question (I'm more of a backend developer), but it seems like the simple solution is remove these two lines:
<div>
#Html.EditorFor(model => model.ProductID)
#Html.ValidationMessageFor(model => model.ProductID)
</div>
Then update the Model in your controller's Create, [post] method to update the ProductID to 100, prior to writing it out to the repository. Of course, how you'd do that depends on your controller structure, which you haven't posted.
As I understand it, the alternative would be to have a hidden field on the page and create the Model with a ProductID of 100 in the initial Create call but if you're always going to hard code the product id (which to be honest seems questionable) to 100, then this seems pointless...

Master-Detail Sample Code for MVC 3 Razor (using Ajax for details) - Part 2

I am currently showing a treeview in a left column.
When a user selects a node, i am loading the right column #details with the response from an ajax call. This works nicely.
I now want to submit the right columns #details via ajax as well. I am able to capture the post back to the server however when i return a string back to the #details section it is loading the entire page with string 'saved successfully'
I really want the string 'saved successfully' to be placed in a div element in the right column.
This is an ajax response, again doing another ajax response (which i want to return to the first ajax response).
Is this possible?
My edit form looks like the following
#using (Ajax.BeginForm("Edit", new AjaxOptions { UpdateTargetId = "#results" })) {
#Html.ValidationSummary(true)
if (Model != null) {
<fieldset>
<legend>Code</legend>
#Html.HiddenFor(model => model.CodeID)
<div class="editor-label">
#Html.LabelFor(model => model.Description)
</div>
<div class="editor-field">
#Html.EditorFor(model => model.Description)
#Html.ValidationMessageFor(model => model.Description)
</div>
<div class="editor-label">
#Html.LabelFor(model => model.Note)
</div>
<div class="editor-field">
#Html.EditorFor(model => model.Note)
#Html.ValidationMessageFor(model => model.Note)
</div>
<div class="editor-label">
#Html.LabelFor(model => model.DateModified)
</div>
<div class="editor-field">
#Html.EditorFor(model => model.DateModified)
#Html.ValidationMessageFor(model => model.DateModified)
</div>
<div class="editor-label">
#Html.LabelFor(model => model.TopicID)
</div>
<div class="editor-field">
#Html.DropDownListFor(model => model.TopicID, (SelectList)ViewData["Topics"], "Select")
#Html.ValidationMessageFor(model => model.TopicID)
</div>
<div class="editor-label">
#Html.LabelFor(model => model.Special)
</div>
<div class="editor-field">
#Html.EditorFor(model => model.Special)
#Html.ValidationMessageFor(model => model.Special)
</div>
<div class="editor-label">
#Html.LabelFor(model => model.Html)
</div>
<div class="editor-field">
#Html.EditorFor(model => model.Html)
#Html.ValidationMessageFor(model => model.Html)
</div>
<p>
<input type="submit" value="Save" />
</p>
</fieldset>
}
}
<div>
#Html.ActionLink("Back to List", "Index")
</div>
<div id="results">
Status
</div>
Make sure you have included the following script to your page if you want to use the Ajax.* helpers:
<script src="#Url.Content("~/Scripts/jquery.unobtrusive-ajax.js")" type="text/javascript"></script>
If you don't include it there is nothing out there to make sense of the HTML5 data-* attributes emitted by the Ajax.* helper and AJAXify this form => the form performs a normal submit and renders the results.

I can delete Html.HiddenFor(model=>model.Id) and the app still works. What is it for?

If VS creates a strongly-typed view for the [HttpGet] Create, I get markup for the model as follows.
Note that the code has been simplified for the sake of brevity. The important point is that VS does NOT include Html.HiddenFor(model=>model.Id).
//Create.cshtml
#model MvcMovie.Models.Movie
#using (Html.BeginForm())
{
#Html.ValidationSummary(true)
<fieldset>
<legend>Movie</legend>
<div class="editor-label">
#Html.LabelFor(model => model.Title)
</div>
<div class="editor-field">
#Html.EditorFor(model => model.Title)
#Html.ValidationMessageFor(model => model.Title)
</div>
<div class="editor-label">
#Html.LabelFor(model => model.ReleaseDate)
</div>
<div class="editor-field">
#Html.EditorFor(model => model.ReleaseDate)
#Html.ValidationMessageFor(model => model.ReleaseDate)
</div>
<p>
<input type="submit" value="Create" />
</p>
</fieldset>
}
Now I create a templated HTML helper EDITOR named Movie.cshtml for the type Movie as follows.
Note that the code has been simplified for the sake of brevity. The important point is that VS DOES include Html.HiddenFor(model=>model.Id).
//Movie.cshtml
#model MvcMovie.Models.Movie
#Html.HiddenFor(model => model.Id)
<div class="editor-label">
#Html.LabelFor(model => model.Title)
</div>
<div class="editor-field">
#Html.EditorFor(model => model.Title)
#Html.ValidationMessageFor(model => model.Title)
</div>
<div class="editor-label">
#Html.LabelFor(model => model.ReleaseDate)
</div>
<div class="editor-field">
#Html.EditorFor(model => model.ReleaseDate)
#Html.ValidationMessageFor(model => model.ReleaseDate)
</div>
If I use this templated, I must change Create.cshtml as follows:
//Create.cshtml
#model MvcMovie.Models.Movie
#using (Html.BeginForm())
{
#Html.ValidationSummary(true)
<fieldset>
<legend>Movie</legend>
#Html.EditorForModel()
<p>
<input type="submit" value="Create" />
</p>
</fieldset>
}
The questions are:
Since the hidden field form can be deleted without any side effect, in this case, what is the hidden field for?
It adds hidden field because it doesn't know how action looks like. Action will contain parameter ID in url thus it is not required to put it into hidden field. However in template, VS doesn't know whether action will contain ID or not, so it puts there hidden field holding id to be sure.

MVC 3 - Posting partial view to a chosen controller

I'm trying to learn MVC 3 and Razor coming from a ASP.NET background.
I've want to get a simple partial view (in the shared folder) to post to a specific controller so that I can re-use it elsewhere such as for articles, blogs etc. I tried using variations of the following.
#using (Html.BeginForm("Create", "Comment", FormMethod.Post, new { }))
{
<div>
<fieldset>
<legend>Comments</legend>
<div >
#Html.LabelFor(m => m.Name)
#Html.TextBoxFor(m => m.Name)
</div>
<div >
#Html.LabelFor(m => m.Email)
#Html.TextBoxFor(m => m.Email)
</div>
<div >
#Html.LabelFor(m => m.Body)
#Html.TextBoxFor(m => m.Body)
</div>
<p>
<input type="submit" value="Create" />
</p>
</fieldset>
</div>
}
This doesn't post to the comments controller action Create as shown below.
[HttpPost]
public ActionResult Create()
{
// Save comment code here
return View();
}
There is any simple way of doing this without having to bound to a specfic route?
I found the answer.
#using (Ajax.BeginForm("Create", "Comment", new AjaxOptions() {
UpdateTargetId = "MainContainer" }))
{
<div>
<fieldset>
<legend>Comments</legend>
<div >
#Html.LabelFor(m => m.Name)
#Html.TextBoxFor(m => m.Name)
</div>
<div >
#Html.LabelFor(m => m.Email)
#Html.TextBoxFor(m => m.Email)
</div>
<div >
#Html.LabelFor(m => m.Body)
#Html.TextBoxFor(m => m.Body)
</div>
<p>
<input type="submit" value="Create" />
</p>
</fieldset>
</div>
}
This posts back using ajax and doesn't change the URL. Or you can do it this way using JQuery http://jvance.com/blog/2010/02/20/MakingAnAjaxFormWithJQueryInASPdotNETMVC.xhtml

Resources