Pass data from ViewModel to Controller

Question

I'm trying to post the data of the viewmodel from the form to an action method on the controller, but it's always null.

This is my View:

@model HotelSystem.ViewModels.UpdateReservationVM

@{
ViewBag.Title = "Update Reservation";
}

<h2>Update Reservation</h2>

@using (Html.BeginForm("Update", "Reservations", FormMethod.Post, new { @class = "form-horizontal" }))
{


<div class="form-horizontal">

    <hr />
    @Html.ValidationSummary(true, "", new { @class = "text-danger" })
    <div class="form-group">
        @Html.LabelFor(Model => Model.Reservation.Guest.FirstName, htmlAttributes: new { @class = "control-label col-md-2" })
        <div class="col-md-10">
            @Html.HiddenFor(Model => Model.Reservation.ReservationID)
            @Html.EditorFor(model => model.Reservation.Guest.FirstName, new { htmlAttributes = new { @class = "form-control", @id = "ReservationID", @disabled = true } })
            @Html.ValidationMessageFor(model => model.Reservation.Guest.FirstName, "", new { @class = "text-danger" })
        </div>
    </div>

    <div class="form-group">
        @Html.LabelFor(model => model.Reservation.Guest.MiddleName, htmlAttributes: new { @class = "control-label col-md-2" })
        <div class="col-md-10">
            @Html.EditorFor(model => model.Reservation.Guest.MiddleName, new { htmlAttributes = new { @class = "form-control", @id = "Arrival", @disabled = true } })
            @Html.ValidationMessageFor(model => model.Reservation.Guest.MiddleName, "", new { @class = "text-danger" })
        </div>
    </div>

    <div class="form-group">
        @Html.LabelFor(model => model.Reservation.Guest.LastName, htmlAttributes: new { @class = "control-label col-md-2", @id = "Departure" })
        <div class="col-md-10">
            @Html.EditorFor(model => model.Reservation.Guest.LastName, new { htmlAttributes = new { @class = "form-control", @disabled = true } })
            @Html.ValidationMessageFor(model => model.Reservation.Guest.LastName, "", new { @class = "text-danger" })
        </div>
    </div>

    <div class="form-group">
        @Html.LabelFor(model => model.Reservation.Guest.PhoneNo, "Phone Number", htmlAttributes: new { @class = "control-label col-md-2" })
        <div class="col-md-10">
            @Html.EditorFor(model => model.Reservation.Guest.PhoneNo, new { htmlAttributes = new { @class = "form-control" } })
            @Html.ValidationMessageFor(model => model.Reservation.Guest.PhoneNo, "", new { @class = "text-danger" })
        </div>
    </div>

    <div class="form-group">
        @Html.LabelFor(model => model.Reservation.Guest.MobileNo, "Mobile #", htmlAttributes: new { @class = "control-label col-md-2" })
        <div class="col-md-10">
            @Html.EditorFor(model => model.Reservation.Guest.MobileNo, new { htmlAttributes = new { @class = "form-control" } })
            @Html.ValidationMessageFor(model => model.Reservation.Guest.MobileNo, "", new { @class = "text-danger" })
        </div>
    </div>

    <div class="form-group">
        @Html.LabelFor(model => model.Reservation.Guest.HomeAddress, htmlAttributes: new { @class = "control-label col-md-2" })
        <div class="col-md-10">
            @Html.EditorFor(model => model.Reservation.Guest.HomeAddress, new { htmlAttributes = new { @class = "form-control" } })
            @Html.ValidationMessageFor(model => model.Reservation.Guest.HomeAddress, "", new { @class = "text-danger" })
        </div>
    </div>

    <div class="form-group">
        @Html.LabelFor(model => model.Reservation.Guest.Occupation, "Occupation", htmlAttributes: new { @class = "control-label col-md-2" })
        <div class="col-md-10">
            @Html.EditorFor(model => model.Reservation.Guest.Occupation, new { htmlAttributes = new { @class = "form-control" } })
            @Html.ValidationMessageFor(model => model.Reservation.Guest.Occupation, "", new { @class = "text-danger" })
        </div>
    </div>

    <div class="form-group">
        @Html.LabelFor(model => model.Reservation.VehiclePlateNo, "Vehicle Plate #", htmlAttributes: new { @class = "control-label col-md-2" })
        <div class="col-md-10">
            @Html.EditorFor(model => model.Reservation.VehiclePlateNo, new { htmlAttributes = new { @class = "form-control" } })
            @Html.ValidationMessageFor(model => model.Reservation.VehiclePlateNo, "", new { @class = "text-danger" })
        </div>
    </div>

    <div class="form-group">
        @Html.LabelFor(model => model.Reservation.Guest.TitleID, "TitleID", htmlAttributes: new { @class = "control-label col-md-2" })
        <div class="col-md-10">
            @Html.DropDownList("TitleID", null, htmlAttributes: new { @class = "form-control" })
            @Html.ValidationMessageFor(model => model.Reservation.Guest.TitleID, "", new { @class = "text-danger" })
        </div>
    </div>

    <div class="form-group">
        @Html.LabelFor(model => model.Reservation.Guest.CountryID, "CountryID", htmlAttributes: new { @class = "control-label col-md-2" })
        <div class="col-md-10">
            @Html.DropDownList("CountryID", null, htmlAttributes: new { @class = "form-control" })
            @Html.ValidationMessageFor(model => model.Reservation.Guest.CountryID, "", new { @class = "text-danger" })
        </div>
    </div>

    <div class="form-group">
        @Html.LabelFor(model => model.Reservation.Guest.NationalityID, "NationalityID", htmlAttributes: new { @class = "control-label col-md-2" })
        <div class="col-md-10">
            @Html.DropDownList("NationalityID", null, htmlAttributes: new { @class = "form-control" })
            @Html.ValidationMessageFor(model => model.Reservation.Guest.NationalityID, "", new { @class = "text-danger" })
        </div>
    </div>

    <div class="form-group">
        @Html.LabelFor(model => model.Reservation.Guest.VIPID, "VIPID", htmlAttributes: new { @class = "control-label col-md-2" })
        <div class="col-md-10">
            @Html.DropDownList("VIPID", null, htmlAttributes: new { @class = "form-control" })
            @Html.ValidationMessageFor(model => model.Reservation.Guest.VIPID, "", new { @class = "text-danger" })
        </div>
    </div>

    <div class="form-group">
        @Html.LabelFor(model => model.Reservation.AgencyID, "AgencyID", htmlAttributes: new { @class = "control-label col-md-2" })
        <div class="col-md-10">
            @Html.DropDownList("AgencyID", null, htmlAttributes: new { @class = "form-control" })
            @Html.ValidationMessageFor(model => model.Reservation.AgencyID, "", new { @class = "text-danger" })
        </div>
    </div>

    <div class="form-group">
        @Html.LabelFor(model => model.Reservation.GroupProfileID, "GroupProfileID", htmlAttributes: new { @class = "control-label col-md-2" })
        <div class="col-md-10">
            @Html.DropDownList("AgencyID", null, htmlAttributes: new { @class = "form-control" })
            @Html.ValidationMessageFor(model => model.Reservation.GroupProfileID, "", new { @class = "text-danger" })
        </div>
    </div>

    <div class="form-group">
        @Html.LabelFor(model => model.Reservation.Guest.CompanyID, "Commpany", htmlAttributes: new { @class = "control-label col-md-2" })
        <div class="col-md-10">
            @Html.DropDownList("CompanyID", null, htmlAttributes: new { @class = "form-control" })
            @Html.ValidationMessageFor(model => model.Reservation.Guest.CompanyID, "", new { @class = "text-danger" })
        </div>
    </div>

    <div class="form-group">
        @Html.LabelFor(model => model.Reservation.GroupProfileID, "Group Profile", htmlAttributes: new { @class = "control-label col-md-2" })
        <div class="col-md-10">
            @Html.DropDownList("GroupProfileID", null, htmlAttributes: new { @class = "form-control" })
            @Html.ValidationMessageFor(model => model.Reservation.GroupProfileID, "", new { @class = "text-danger" })
        </div>
    </div>

    <div class="form-group">
        @Html.LabelFor(model => model.Reservation.SourceID, "SourceID", htmlAttributes: new { @class = "control-label col-md-2" })
        <div class="col-md-10">
            @Html.DropDownList("SourceID", null, htmlAttributes: new { @class = "form-control" })
            @Html.ValidationMessageFor(model => model.Reservation.SourceID, "", new { @class = "text-danger" })
        </div>
    </div>

    <div class="form-group">
        @Html.LabelFor(model => model.Reservation.Guest.EmailAdd, "Email Address", htmlAttributes: new { @class = "control-label col-md-2" })
        <div class="col-md-10">
            @Html.EditorFor(model => model.Reservation.Guest.EmailAdd, new { htmlAttributes = new { @class = "form-control" } })
            @Html.ValidationMessageFor(model => model.Reservation.Guest.EmailAdd, "", new { @class = "text-danger" })
        </div>
    </div>
    <div class="form-group">
        <label class="control-label col-md-2">Room Information</label>


    </div>
    <div class="form-group">
        @Html.LabelFor(model => model.Reservation.Arrival, "Arrival", htmlAttributes: new { @class = "control-label col-md-2" })
        <div class="col-md-10">
            @Html.EditorFor(model => model.Reservation.Arrival, new { htmlAttributes = new { @class = "form-control" } })
            @Html.ValidationMessageFor(model => model.Reservation.Arrival, "", new { @class = "text-danger" })
        </div>
    </div>
    <div class="form-group">
        @Html.LabelFor(model => model.Reservation.Departure, "Departure", htmlAttributes: new { @class = "control-label col-md-2" })
        <div class="col-md-10">
            @Html.EditorFor(model => model.Reservation.Departure, new { htmlAttributes = new { @class = "form-control" } })
            @Html.ValidationMessageFor(model => model.Reservation.Departure, "", new { @class = "text-danger" })
        </div>
    </div>
    <div class="form-group">
        <label class="control-label col-md-2">Nigt(s)</label>
        <div class="col-md-1">
            <input class="form-control" id="nights" />
         </div>
        <label class="control-label col-md-2">No. Of Room</label>
        <div class="col-md-1">
            @Html.EditorFor(model => model.Reservation.NoOfRooms, new { htmlAttributes = new { @class = "form-control" } })
            @Html.ValidationMessageFor(model => model.Reservation.NoOfRooms, "", new { @class = "text-danger" })
        </div>
    </div>
    <div class="form-group">
        @Html.LabelFor(model => model.Reservation.NoOfAdults, "No of Adults", htmlAttributes: new { @class = "control-label col-md-2" })
        <div class="col-md-1">
            @Html.EditorFor(model => model.Reservation.NoOfAdults, new { htmlAttributes = new { @class = "form-control", @id = "NoOfAdults" } })
            @Html.ValidationMessageFor(model => model.Reservation.NoOfAdults, "", new { @class = "text-danger" })
        </div>
        @Html.LabelFor(model => model.Reservation.NoOfChild, "Child", htmlAttributes: new { @class = "control-label col-md-2" })
        <div class="col-md-1">
            @Html.EditorFor(model => model.Reservation.NoOfChild, new { htmlAttributes = new { @class = "form-control" } })
            @Html.ValidationMessageFor(model => model.Reservation.NoOfChild, "", new { @class = "text-danger" })
        </div>
    </div>
    <div class="form-group">
        @Html.LabelFor(model => model.Room.RoomTypeID, "RoomTypeID", htmlAttributes: new { @class = "control-label col-md-2" })
        <div class="col-md-2">
            @Html.DropDownList("RoomTypeID", null, htmlAttributes: new { @class = "form-control", @id = "RoomTypeID" })
            @Html.ValidationMessageFor(model => model.Room.RoomTypeID, "", new { @class = "text-danger" })
        </div>
    </div>
    <div class="form-group">
        @Html.LabelFor(model => model.Reservation.RateID, "Rate", htmlAttributes: new { @class = "control-label col-md-1" })
        <div class="col-md-2">
            @Html.DropDownList("RateID", null, htmlAttributes: new { @class = "form-control", @id = "RateID" })
            @Html.ValidationMessageFor(model => model.Reservation.RateID, "", new { @class = "text-danger" })
        </div>
        @Html.LabelFor(model => model.Room.RoomID, "RoomID", htmlAttributes: new { @class = "control-label col-md-2" })
        <div class="col-md-1">
            @Html.DropDownList("RoomID", null, htmlAttributes: new { @class = "form-control" })
            @Html.ValidationMessageFor(model => model.Room.RoomID, "", new { @class = "text-danger" })
        </div>
    </div>
    <div class="form-group">
        @Html.LabelFor(model => model.Reservation.Rate, "Rate", htmlAttributes: new { @class = "control-label col-md-2" })
        <div class="col-md-10">
            @Html.EditorFor(model => model.Reservation.Rate, new { htmlAttributes = new { @class = "form-control", @id = "Rate" } })
            @Html.ValidationMessageFor(model => model.Reservation.Rate, "", new { @class = "text-danger" })
        </div>
    </div>



    <div class="form-group">
        @Html.LabelFor(model => model.Reservation.ReservationTypeID, "ReservationTypeID", htmlAttributes: new { @class = "control-label col-md-2" })
        <div class="col-md-10">
            @Html.DropDownList("ReservationTypeID", null, htmlAttributes: new { @class = "form-control" })
            @Html.ValidationMessageFor(model => model.Reservation.ReservationTypeID, "", new { @class = "text-danger" })
        </div>
    </div>

    <div class="form-group">
        @Html.LabelFor(model => model.Reservation.GroupProfileID, "GroupProfile", htmlAttributes: new { @class = "control-label col-md-2" })
        <div class="col-md-10">
            @Html.DropDownList("GroupProfileID", null, htmlAttributes: new { @class = "form-control" })
            @Html.ValidationMessageFor(model => model.Reservation.GroupProfileID, "", new { @class = "text-danger" })
        </div>
    </div>

    <div class="form-group">
        @Html.LabelFor(model => model.Reservation.Guest.TitleID, "TitleID", htmlAttributes: new { @class = "control-label col-md-2" })
        <div class="col-md-10">
            @Html.DropDownList("TitleID", null, htmlAttributes: new { @class = "form-control" })
            @Html.ValidationMessageFor(model => model.Reservation.Guest.TitleID, "", new { @class = "text-danger" })
        </div>
    </div>

    <div class="form-group">
        @Html.LabelFor(model => model.Reservation.Guest.NationalityID, "NationalityID", htmlAttributes: new { @class = "control-label col-md-2" })
        <div class="col-md-10">
            @Html.DropDownList("NationalityID", null, htmlAttributes: new { @class = "form-control" })
            @Html.ValidationMessageFor(model => model.Reservation.Guest.NationalityID, "", new { @class = "text-danger" })
        </div>
    </div>



    <div class="form-group">
        @Html.LabelFor(model => model.Payment.PaymentTypeID, "PaymentTypeID", htmlAttributes: new { @class = "control-label col-md-2" })
        <div class="col-md-10">
            @Html.DropDownList("PaymentTypeID", null, htmlAttributes: new { @class = "form-control" })
            @Html.ValidationMessageFor(model => model.Payment.PaymentTypeID, "", new { @class = "text-danger" })
        </div>
    </div>
    <div class="form-group">
        @Html.LabelFor(model => model.Payment.CardID, "CardTypeID", htmlAttributes: new { @class = "control-label col-md-2" })
        <div class="col-md-10">
            @Html.DropDownList("CardTypeID", null, htmlAttributes: new { @class = "form-control" })
            @Html.ValidationMessageFor(model => model.Payment.CardID, "", new { @class = "text-danger" })
        </div>
    </div>
    <div class="form-group">
        @Html.LabelFor(model => model.Payment.BookBy, "BookBy", htmlAttributes: new { @class = "control-label col-md-2" })
        <div class="col-md-10">
            @Html.DropDownList("BookBy", null, htmlAttributes: new { @class = "form-control" })
            @Html.ValidationMessageFor(model => model.Payment.BookBy, "", new { @class = "text-danger" })
        </div>
    </div>

    <div class="form-group">
        <div class="col-md-offset-2 col-md-10">
            <input type="submit" value="Create" class="btn btn-default" onclick="return confirm('Are you sure you want to proceed transaction?');" />
            <input type="button" value="Options" class="btn btn-default" id="alert" />
            <a href="#" data-bb="alert_callback" class="btn btn-default" id="alert2">Options</a>

        </div>
    </div>
</div>
}

Then this is the Action Method:

[HttpPost]
public ActionResult Update(ViewModels.UpdateReservationVM reservation)
{
    if (ModelState.IsValid)
    {
       db.Entry(reservation).State = EntityState.Modified;
       db.SaveChanges();
       return RedirectToAction("Index");
    }

    return View(reservation);
}

Then this is my View Model:

public class UpdateReservationVM
{
    public virtual Reservation Reservation { get; set; }

    public virtual Payment Payment { get; set; }

    public virtual FlightInfo Flight { get; set; }

    public virtual RoomReservation Room { get; set; }


    public virtual Transfer Transfer { get; set; }
}

What is wrong with this code? Tried to debug it, it always goes to the action method of the controller but values passed are all NULL.

modified my question, @DLeh well payment,flight,room,and transfer are null once i submit the form — Luigi Vibal, Jan 15 '15 at 13:42

tintyethan · Answer 1 · 2015-01-15T14:03:21.137

Try...

[HttpPost]
public ActionResult Update(ViewModels.UpdateReservationVM reservation)
{
    if (ModelState.IsValid)
    {
        db.Reservation.Attach(UpdateReservationVM.reservation);
        db.Entry(UpdateReservationVM.reservation).State = EntityState.Modified;
        db.SaveChanges();
        return RedirectToAction("Index");
    }

    return View(reservation);
}

Check to see that reservation (lowercase) is not null when debugging.

On a side note, you may want to change

public ActionResult Update(ViewModels.UpdateReservationVM reservation)

to

public ActionResult Update(UpdateReservationVM reservation)

and add a using statement at the top of your controller to include the viewmodel namespace...

using YOURPROJECTNAME.NAMEOFVIEWMODELSFOLDER;

So, in my case its

using salesWebsite.viewModel;

score -1 · Answer 2 · answered Jan 15 '15 at 13:53

-1

Add an antiforgerytoken in your form:

@using (Html.BeginForm("Update", "Reservations", FormMethod.Post, new { @class = "form-horizontal" }))
{
    @Html.AntiForgeryToken()
    @*
        rest of code
    *@
}

answered Jan 15 '15 at 13:53

devqon

13,818
2
30
45

@Luigi Vibal - if you do this, you'll also need to add [ValidateAntiForgeryToken] just below [HttpPost] in the controller. – tintyethan Jan 15 '15 at 13:54
@tintyethan still not working – Luigi Vibal Jan 15 '15 at 15:51
Did you do what I said in my full response above? Adding the antiforgerytoken is good practice, but I don't think its related to your null form values. – tintyethan Jan 15 '15 at 16:11

Pass data from ViewModel to Controller

2 Answers2