MVC4 forms that save to entity framework models

Question

I have the following course model created using EF code first:

public class Course
{
    [Key]
    public int CourseID { get; set; }

    [StringLength(50)]
    public string Name { get; set; }

    [StringLength(200)]
    public string Description { get; set; }

    [StringLength(50)]
    public string Author { get; set; }

    public DateTime UploadDate { get; set; }

    public DateTime ExpiryDate { get; set; }

    public int ParticipationPoints { get; set; }

    public string BlobURL { get; set; }

    //1 to many relationship
    public virtual ICollection<Audit> Audits { get; set; }

    public virtual ICollection<Content> Contents { get; set; }

    public virtual ICollection<Enrollment> Enrollments { get; set; }

    public virtual ICollection<Feedback> Feedbacks { get; set; }

    public virtual ICollection<Keyword> Keywords  { get; set; }

    public virtual ICollection<Target> Targets { get; set; }

    public virtual ICollection<CourseSection> CourseSections { get; set; }

    //many to many relationship
    public virtual ICollection<MetaLearningUser> MetaLearningUsers { get; set; }

}

In design mode I have the following HTML fields:

<form class="custom">
       <fieldset>
         <div class="row">
           <div class="twelve columns">
             <div class="row">
               <div class="six columns">
                 <label>Course Title</label>
                 <input type="text">
               </div>
               <div class="six columns">
                 <label>Author</label>
                 <input type="text">
               </div>
             </div>

             <div class="row">
               <div class="six columns">
                 <label>Keywords</label>
                 <input type="text">
                </div>
                <div class="six columns">
                  <label>Metadata</label>
                  <input type="text">
                </div>
             </div>

             <div class="row">
               <div class="twelve columns">
                 <label>Description</label>
                 <textarea></textarea>
               </div>
             </div>

             <div class="row">
               <div class="six columns bottom20">
                 <label>Media type</label>
                   <div class="custom dropdown"> <a href="#" class="current"> Select media type </a> <a href="#" class="selector"></a>
                     <ul>
                       <li>Screencast</li>
                       <li>Podcast</li>
                       <li>Document</li>
                       <li>SCORM</li>
                     </ul>
                   </div>
               </div>
               <div class="six columns bottom20">
                 <label>Directory</label>
                   <div class="custom dropdown"> <a href="#" class="current"> Select subject </a> <a href="#" class="selector"></a>
                     <ul>                       
                       <li>Human Resources</li>
                       <li>IT Security</li>
                       <li>Corporate Governance</li>
                       <li>Health &amp; Safety</li>
                       <li>Legal</li>
                       <li>IT Infrastructure</li>
                       <li>3rd Parties</li>
                     </ul>
                   </div>
               </div>
           </div>
           <div class="row">
             <div class="six columns">
               <label>Start date</label>
               <input type="date" class="datefield">
             </div>
             <div class="six columns">
               <label>End date</label>
               <input type="date" class="datefield">
             </div>
           </div>
           </div>
         </div>
         <a href="#" class="medium button bottom20">Submit</a>
        </fieldset>
      </form>
    </div>

How can I save the data entered in the text boxes to the entity framework database when the submit button is pressed?

Answer 1

When you send in the model to the view, use something like

@using(Html.BeginForm("Index"))
{
   @Html.TexboxFor(x => x.Name) // istead of <input type=text>
   @Html.TextborFor(x => x.Description)
   <input type="submit" value="Submit button"/>
}

to bind the model to the view, which in turn will make it post back when you click the submitt button.

In the controller you have something like

[HttpPost]
public ActionResult Index(CourseViewModel model) // because you'd want to use a 
// view model and not the entity itself
{
// check if the model is valid
// maybe some more logic
db.SaveChanges();
return View(model);
}