Question

I am creating a dynamic list of text boxes. when the user submits the value in the fields come back null. I think I’m missing something.

This is my product model:

public class EnqProduct
{
    public string Id { get; set; }
    public string Product { get; set; }
    public string Quantity { get; set; }
}

This is the page model which includes a list of the above.

public IList<EnqProduct> EnqProduct { get; set; }

This is how I am setting the model:

IList<EnqProduct> items2 = Session["enquiry"] as IList<EnqProduct>;
var EnquiryModel = new Enquiry { 
       EnqProduct = items2  
};      
return View(EnquiryModel);

and this is how I display the fields:

foreach (var item in Model.EnqProduct)
{
 <tr>
   <td>
      <span class="editor-field">
         @Html.TextBox(item.Id, item.Product)
         @Html.ValidationMessageFor(m => m.A1_Enquiry)
      </span>  
      <br><br>                              
    </td>
    <td>
      <span id = "field" class="editor-field">
         @Html.TextBox(item.Id, item.Quantity)
      </span>      
      <br><br>                              
    </td>
  </tr>
 }

When the user submits the fields go back to the controller null?

Answer 1

I would recommend you using editor templates and replace your foreach loop with the following:

@model Enquiry
<table>
    <thead>
        <tr>
            <th>product name</th>
            <th>quantity</th>
        </tr>
    </thead>
    <tbody>
        @Html.EditorFor(x => x.EnqProduct)
    </tbody>
</table>

and then define an editor template which will automatically be rendered for each element of the EnqProduct collection (~/Views/Shared/EditorTemplates/EnqProduct.cshtml):

@model EnqProduct
<tr>
    <td>
        @* We include the id of the current item as hidden field *@
        @Html.HiddenFor(x => x.Id)

        <span class="editor-field">
            @Html.EditorFor(x => x.Product)
            @Html.ValidationMessageFor(x => x.Product)
        </span>  
    </td>
    <td>
        <span id="field" class="editor-field">
            @Html.EditorFor(x => x.Quantity)
        </span>      
    </td>
</tr>

Now when you submit the form you will get correct values:

public class HomeController: Controller
{
    public ActionResult Index()
    {
        var model = new Enquiry();
        model.EnqProduct = ...
        return View(model);
    }

    [HttpPost]
    public ActionResult Index(Enquiry model)
    {
        // the model.EnqProduct will be correctly populated here
        ...
    }
}

As far as the correct wire format that the default model binder expects for your input fields I would recommend you taking a look at the following article. It will allow you to more easily debug problems in the feature when some model is not properly populated. It suffice to look with FireBug and the name of the values being POSTed and you will immediately know whether they are OK or KO.