Question

I am currently going through the MVC tutorial Nerd Dinner using MVS 2010 I have got up to step 7 but I have just noticed that when I now go to the create screen, it is not quite correct.

1. the title input box seems to contain the ViewBag.Title Rather than being blank.
2. the EventDate input box is blank when it should be automatically set to 7 days from now.

I don’t remember it being like this earlier on in the tutorial.

Here is the snippit from the DinnersController.cs that handles Create:

    //
    // GET: /Dinners/Create

    public ActionResult Create()
    {
        Dinner dinner = new Dinner()
        {
            EventDate = DateTime.Now.AddDays(7)
        };

        return View(new DinnerFormViewModel(dinner));
    }

    //
    // POST: /Dinners/Create

    [AcceptVerbs(HttpVerbs.Post)]
    public ActionResult Create(Dinner dinner)
    {
        if (ModelState.IsValid)
        {
            try
            {
                dinner.HostedBy = "SomeUser";

                dinnerRepository.Add(dinner);
                dinnerRepository.Save();

                return RedirectToAction("Details", new { id = dinner.DinnerID });
            }
            catch
            {
                ModelState.AddModelErrors(dinner.GetRuleViolations());
            }

        }

        return View(new DinnerFormViewModel(dinner));
    }

And here is the View Create.cshtml

@model NerdDinner.Models.DinnerFormViewModel

@{
    ViewBag.Title = "Host a Dinner";
}

<h2>Host a Dinner</h2>

@Html.ValidationSummary("Please correct the errors and try again")

@using (Html.BeginForm()) {

    <fieldset>
        <p>
            @Html.LabelFor(model => Model.Dinner.Title)
            <br />
            @Html.TextBox("Title")
            @Html.ValidationMessage("Title", "*")
        </p>
        <p>
            @Html.LabelFor(model => Model.Dinner.EventDate)
            <br />
            @Html.TextBox("EventDate")
            @Html.ValidationMessage("EventDate", "*")
        </p>
        <p>
            @Html.LabelFor(model => Model.Dinner.Description)
            <br />
            @Html.TextArea("Description")
            @Html.ValidationMessage("Description", "*")
        </p>
        <p>
            @Html.LabelFor(model => Model.Dinner.Address)
            <br />
            @Html.TextBox("Address")
            @Html.ValidationMessage("Address", "*")
        </p>
        <p>
            @Html.LabelFor(model => Model.Countries)
            <br />
            @Html.DropDownList("Country", Model.Countries)
            @Html.ValidationMessage("Country", "*")
        </p>
        <p>
            @Html.LabelFor(model => Model.Dinner.ContactPhone)
            <br />
            @Html.TextBox("ContactPhone")
            @Html.ValidationMessage("ContactPhone", "*")
        </p>
        <p>
            @Html.LabelFor(model => Model.Dinner.Latitude)
            <br />
            @Html.TextBox("Latitude")
            @Html.ValidationMessage("Latitude", "*")
        </p>
        <p>
            <label for="Longitude">Longitude:</label>
            <br />
            @Html.TextBox("Longitude")
            @Html.ValidationMessage("Longitude", "*")
        </p>
        <p>
            <input type="submit" value="Create" />
        </p>
    </fieldset>
}

<div>
    @Html.ActionLink("Back to List", "Index")
</div>

And finally here is the output in the browser:

Anyone know what I’m missing?

EDIT – Added Dinner Model

using System;
using System.Collections.Generic;
using System.Data.Linq;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using System.Text; //added this - not in tut
using System.Text.RegularExpressions; //added this - not in tut

namespace NerdDinner.Models
{
    [Bind(Include = "Title,Description,EventDate,Address,Country,ContactPhone,Latitude,Longitude")]
    public partial class Dinner
    {

        public bool IsValid
        {
            get { return (GetRuleViolations().Count() == 0); }
        }

        public IEnumerable<RuleViolation> GetRuleViolations()
        {
            if (String.IsNullOrEmpty(Title))
                yield return new RuleViolation("Title required", "Title");

            if (String.IsNullOrEmpty(Description))
                yield return new RuleViolation("Description required", "Description");

            if (String.IsNullOrEmpty(HostedBy))
                yield return new RuleViolation("HostedBy required", "HostedBy");

            if (String.IsNullOrEmpty(Address))
                yield return new RuleViolation("Address required", "Address");

            if (String.IsNullOrEmpty(Country))
                yield return new RuleViolation("Country required", "Country");

            if (String.IsNullOrEmpty(ContactPhone))
            {
                yield return new RuleViolation("ContactPhone required", "ContactPhone");
            }
            else
            {
                if (!PhoneValidator.IsValidNumber(ContactPhone, Country))
                    yield return new RuleViolation("Phone# does not match country", "ContactPhone");
            }


                yield break;
        }

        partial void OnValidate(ChangeAction action)
        {
            if (!IsValid)
                throw new ApplicationException("Rule voilations prevent saving");
        }

    }

    public class RuleViolation
    {
        public string ErrorMessage { get; private set; }
        public string PropertyName { get; private set; }

        public RuleViolation(string errorMessage, string propertyName)
        {
            ErrorMessage = errorMessage;
            PropertyName = propertyName;
        }
    }

    public class PhoneValidator
    {
        static IDictionary<string, Regex> countryRegex = new Dictionary<string, Regex>()
        {
            { "USA", new Regex("^[2-9]\\d{2}-\\d{3}-\\d{4}$")},
            { "UK", new Regex("(^1300\\d{6}$)|(^1800|1900|1902\\d{6}$)|(^0[2|3|7|8]{1}[0-9]{8}$)|(^04\\decimal{2,3}\\decimal{6}$)")},
            { "Netherlands", new Regex("(^\\+[0-9]{2}|^\\+[0-9]{2}\\(0\\)|^\\(\\+[0-9]{2}\\)\\(0\\)|^00[0-9]{2}|^0)([0-9]{9}$|[0-9\\-\\s]{10}$)")},

        };

        public static bool IsValidNumber(string phoneNumber, string country)
        {
            if (country != null && countryRegex.ContainsKey(country))
                return countryRegex[country].IsMatch(phoneNumber);
            else
                return false;
        }

        public static IEnumerable<string> Countries
        {
            get
            {
                return countryRegex.Keys;
            }
        }
    }

    public class DinnerFormViewModel
    {

        // Properties
        public Dinner Dinner { get; private set; }
        public SelectList Countries { get; private set; }

        // Contructor
        public DinnerFormViewModel(Dinner dinner)
        {
            Dinner = dinner;
            Countries = new SelectList(PhoneValidator.Countries, dinner.Country);
        }
    }
}

Answer 1

You should be using @Html.TextboxFor instead of @Html.Textbox

<p>
            @Html.LabelFor(model => Model.Dinner.EventDate)
            <br />
            @Html.TextBoxFor(model => Model.Dinner.EventDate)
            @Html.ValidationMessageFor(model => Model.Dinner.EventDate)
        </p>

The basic @Html.Textbox will render a textbox with the name attribute specified in the string that you are passing. MVC will look into the ViewBag to see if there are any items with that key to populate the textbox (which is why your Title attribute is using the page title from the top section of your view), but does not tie the view inputs to the actual model or any pre-populated data that you sent with the model. By using the TextBoxFor (or labelFor, etc), this ties that input to the actual model property. This is also how DataAnnotations are applied to the form. What I mean by that last statement is this. Let’s assume this is a piece of your model

public class DinnerViewModel{
  [DisplayName("Dinner Location")]
  [Required(ErrorMessage="You must specify a location")]
  public string Location {get;set;}
}

In your view, you would render the pieces that you need by using the @Html.*For method (like you do your labels)

<p>
   @Html.LabelFor(model => Model.Location )
   <br />
   @Html.TextBoxFor(model => Model.Location)
   @Html.ValidationMessageFor(model => Model.Location )
</p>

Should render some HTML (not including the error message) like this

<p>
  <label for="Location">Dinner Location</label>
  <br/>
  <input type="text" name="Location" id="Location"/>
  *the validation related stuff*
</p>

Addendum

In order for your validation to work with the method that you are using, you have to change your yield return statements slightly. If you look closely at the id’s for the attributes of the actual dinner object in the HTML source, you will see that they are rendering as ‘Dinner.Title‘ or ‘Dinner.Description‘. This is because that is how they are stored in your model (remember using model => Model.Dinner.EventDate?) This will render an element with the id ‘Dinner.EventDate‘.

Given that, you need to update the strings being returned from the RuleViolation portion of your model:

public IEnumerable<RuleViolation> GetRuleViolations()
        {
            if (String.IsNullOrEmpty(Title))
                yield return new RuleViolation("Title required", "Dinner.Title");

            if (String.IsNullOrEmpty(Description))
                yield return new RuleViolation("Description required", "Dinner.Description");

            if (String.IsNullOrEmpty(HostedBy))
                yield return new RuleViolation("HostedBy required", "Dinner.HostedBy");

            if (String.IsNullOrEmpty(Address))
                yield return new RuleViolation("Address required", "Dinner.Address");

            if (String.IsNullOrEmpty(Country))
                yield return new RuleViolation("Country required", "Country");

            if (String.IsNullOrEmpty(ContactPhone))
            {
                yield return new RuleViolation("ContactPhone required", "Dinner.ContactPhone");
            }
            else
            {
                if (!PhoneValidator.IsValidNumber(ContactPhone, Country))
                    yield return new RuleViolation("Phone# does not match country", "Dinner.ContactPhone");
            }


                yield break;
        }

Now your RuleViolations will match the actual input IDs and everything will be shiny and awesome again. This seems like a bit of work, but since you are working through a tutorial, I don’t want to push too much your way. However, as your explore the .NET MVC implentations, you will find other ways to accomplish the same tasks in a less verbose manner. Keep at it!