Issue binding form input to dictionary value

Question

User1396448631 posted

My razor view consists of a displaying and posting back a dictionary.

The dictionary contains date as key which is label and textboxes which are values. 

My code is something like this

// Slots is a dictionary
@if (Model != null && Model.Slots != null)
 {
     foreach (var row in Model.Slots)
     {
          <tr>
              <td scope="col">@row.Key</td>
              <td scope="col" align="center">
                    @Html.TextBoxFor(model => row.Value)
           </tr>
      }
  }

With the above code, when i inspect element on all of the text boxes, it displays the following for all the textboxes which doesnt seem to be correct.

<input id="row_Value" name="row.Value">

Also, when I submit this page, ViewModel's Slot is null.

So then I replaced 

@Html.TextBoxFor(model => row.Value)

with 

<input name="@row.Key" value="@row.Value" /></td>

When I inspect elements now, I see the following which is encouraging.

<input name="8/19/2019" value="0">
<input name="8/20/2019" value="0">
<input name="8/21/2019" value="0">

However when I edit the textboxes and submit, ViewModel's Slot is still null.

Can you please help if I am missing anything doing something wrong?

Thank you

Answer 1

User475983607 posted

Labels are not inputs and therefore NOT submitted in an HTTP POST to the server.  Secondly, text inputs are already name/value pairs. 

Try this...

foreach (var row in Model.Slots)
{
  <tr>
	  <td scope="col">@row.Key</td>
	  <td scope="col" align="center">
		<input type="text" name="@row.Key" value="@row.Value" />
   </tr>
}

Also, I recommend learning HTLM Forms and standard MVC patterns.

https://www.w3schools.com/html/html_forms.asp

https://docs.microsoft.com/en-us/aspnet/mvc/overview/getting-started/introduction/getting-started