MVC model property null on posting form

Question

I'm developing a MVC 4 application and I'm having problem submiting a form using strong view model.

I'm calling a partial view where in the GET actionResult I declare a model instance and passing it to the partial view and store the fields in hidden fields. When debugging I see that all field are getting values and it works fine.

After the user submits the form, I use this model properties plus the properties filled by the user.

The problem is that the To list is getting null when calling the post action result.

The controllers:

   [HttpGet]
    public ActionResult MessageDetails(string id)
    {
        MessageModel m;
        string userfullname =  String.Empty;

        ServiceReference2.WebService1Soap ws = new ServiceReference2.WebService1SoapClient();
        DataTable dt = ws.GetMessageDetails("bcce7f7ad7596f963f4adb23d713e0d4", "329392de8a55edf86c0881a57381cbe6",id,User.Identity.Name).Tables[0];

        if (Session["user"] != null)
            userfullname = ((HaifanetMobile.Models.LoginModel)Session["user"]).LoginDS.Tables[0].Rows[0][((HaifanetMobile.Models.LoginModel)Session["user"]).LoginDS.Tables[0].Columns["fullname"].Ordinal].ToString();

        m = new MessageModel(dt, User.Identity.Name, userfullname);



        return PartialView("MessageDetails",m);
    }


    [HttpPost]
    public ActionResult ReplyMessage(MessageModel model)
    {

     // here's where the To list is getting empty
        var errors = ModelState.Values.SelectMany(v => v.Errors);
        if (ModelState.IsValid)
        {

            model.Send();
            return Content("Success");
        }


        return PartialView("MessageDetails",model);
    }

The view:

@model HaifanetMobile.Models.MessageModel

<script type="text/javascript">
    function showMessagesPanel1() {

        $('#messagedetails_panel').toggle();
        $("#messages_panel").show();
    }


    $(function () {
        $('form').submit(function () {

            $.validator.unobtrusive.parse($('form'));  //added

            if ($(this).valid()) {
                $.ajax({
                    url: this.action,
                    type: this.method,
                    data: $(this).serialize(),
                    success: function (result) {
                        alert("Message Sent");

                    },
                    error: function () {
                        alert("Error");
                    }
                });
            }
            return false;
        });
    });
</script>




    <table id="messages_panel_mbar" cellpadding="0" cellspacing="0">

    <tr>
        <td class="left_mbar">

        </td>
        <td class="main_mbar"> 
        </td>
        <td id="back_msg_details" class="right_mbar"></td>
    </tr>
</table>


    <div style="height:10%; width:100%; font: bold; font-size: 20px; text-align:right;"> @Html.Raw(Model.Subject)</div>
    <div id="msg_chat" style="text-align:right; width:100%; height:auto; max-height:80%; overflow-y:scroll;">
          @Html.Raw(Model.MsgHistory)
    </div>
    <div id="reply_msg" style="height: 5%">reply</div>

    <div id="reply_msg_block" class="visible" style="width:100%; height:45%;">

        @using (Ajax.BeginForm("ReplyMessage", "SettingsMenu", null, new AjaxOptions { }, new { @class = "center_form" }))
        {


            @Html.ValidationSummary(true, "");


            <fieldset style="height:75%">



                @Html.Hidden("Subject", Model.Subject)
                @Html.Hidden("ParentId", Model.ParentId)
                @Html.Hidden("From", Model.From)
                @Html.Hidden("fullnamesender", Model.fullnamesender)
                @Html.Hidden("To", Model.To)


                <div id="textarea_msg_reply">
                        @Html.TextAreaFor(m => m.Content, new { @class = "" })
                        @Html.ValidationMessageFor(m => m.Content)
                </div>

            </fieldset>

            <input type="submit" value="send" />


        }

    </div>

The model:

 public class MessageModel
    {
        public string From { get; set; }

        [Required(ErrorMessage = "Enter To")]
        public List<Contact> To { get; set; }

        [Required(ErrorMessage = "Enter Subject")]
        [StringLength(100, ErrorMessage = "Max 1000 chars")]
        public string Subject {get; set;}

        [StringLength(1000, ErrorMessage = "Max 1000 chars")]
        public string Content { get; set; }

        public string MsgHistory { get; set; }

        public string fullnamesender { get; set; }

        public string ParentId { get; set; }

        public DateTime LastMsgDate { get; set; }

        public bool readed = false;


} // I omitted the constructors....

adhie adhie · Accepted Answer · 2014-03-05T12:36:06

Take a look at this question and the answer.

Using ASP.NET and MVC 3, how can I create hidden fields so that a List with an array as a value of each item in the list binds correctly?

HiddenFor is generally easier to use, but it won't solve your problem by itself. You should place a hidden for every property of every list item you want to use after postback.

However, I would not recommend this approach. You should only place a hidden field for the identifier of the original message, and look up the recipient list after postback.

MVC model property null on posting form

1 Answers