Razor Html.Label produces a blank label

Question

This is in a MVC 4 app. Code looks as follows:

<div id="example">
    
        @if (Model.Questionnaires != null && Model.Questionnaires.Count > 0)
        {
            foreach (var item in Model.Questionnaires)
            {
                @Html.Label(@item.Title)  
                <div class="demo-section">
                    @foreach (var question in item.Questions)
                    {
                        <label id="@question.QuestionId.ToString()">@question.Text</label> <br />
                        @Html.Label(@question.Text ) <br />
                    }
                </div>
                <br />
            }
        }
        else 
        {
            <p>No matching lists where found.</p>
        }
    
</div>

The resulting output look like this:

<div id="example">

  <label for="Pharmacy_Technician">Pharmacy Technician</label>
  <div class="demo-section">
    <label id="e4a2a2c9-2647-674e-b9fa-ff0000785e25">At least 18 years of age</label>
    <br />
    <label for="At_least_18_years_of_age">At least 18 years of age</label>
    <br />
    <label id="16a3a2c9-2647-674e-b9fa-ff0000785e25">Have a high school diploma or GED</label>
    <br />
    <label for="Have_a_high_school_diploma_or_GED">Have a high school diploma or GED</label>
    <br />
    <label id="24a3a2c9-2647-674e-b9fa-ff0000785e25">Have completed a training program or have a minimum 12 months of pharmacy related experience within the last 36 months</label>
    <br />
    <label for="Have_completed_a_training_program_or_have_a_minimum_12_months_of_pharmacy_related_experience_within_the_last_36_months">Have completed a training program or have a minimum 12 months of pharmacy related experience within the last 36 months</label>
    <br />
  </div>
  <br />
  <label for="Phlebotomy_Technician">Phlebotomy Technician</label>
  <div class="demo-section">
    <label id="afa5a2c9-2647-674e-b9fa-ff0000785e25">* Have successfully completed a training program or one year of work experience within the field. There is no specific time frame a candidate must test within once the training or work experience eligibility requirement has been met.</label>
    <br />
    <label for=""></label>
    <br />
    <label id="68a5a2c9-2647-674e-b9fa-ff0000785e25">* Posess a High School Diploma, or the equivalent</label>
    <br />
    <label for="">* Posess a High School Diploma, or the equivalent</label>
    <br />
  </div>
  <br />

</div>


</div>

As you can see there is a blank label that the helper is creating. I do not understand why the Helper is killing the value of the label text.

The other thing that I do not understand is why the for is being populate in the first set of question why the second one is empty.

Answer 1

The LabelFor helpers would be more appropriate, but, as it uses reflection to create the naming, a foreach loop does not provide an index context (so it does not know how to name them correctly).

Try using for loops instead with LabelFor:

        for (var i = 0; i < Model.Questionnaires.Count; i++)
        {
            @Html.LabelFor(Model.Questionnaires[i])  
            <div class="demo-section">
                @foreach (var q = 0; q < item.Questions.Count; q++)
                {
                    <label id="@question.QuestionId.ToString()">@question.Text</label> <br />
                    @Html.LabelFor(@Model.Questionnaires[i].Questions[q]) <br />
                }
            </div>
            <br />
        }

Apologies for any typos, as this was typed directly into the answer from memory, but you get the idea.