Elizabeth Dimova Elizabeth Dimova - 3 months ago 12
ASP.NET (C#) Question

MVC 5 - foreach loop within Model (generating html)

I have the following Razor code which is static and needs to be constructed from the Model:

<div class="row">
<div class="col-lg-4 col-md-3 hidden-sm">
<h4>@Resource.Title</h4>
<p>@Resource.Header_Date</p>
<img src="~/Content/Images/student.png" alt="student" />
</div>
<div class="col-lg-8 col-md-9">
<h4>@Resource.Header_ListTitle</h4>
<div class="row">
<div class="col-sm-6">
<div class="divider"></div>
<ul class="menu">
<li>@Html.ActionLink(Resource.Faculty_One, "Faculty", "Home", new { id = 1 }, null)</li>
<li>@Html.ActionLink(Resource.Faculty_Three, "Faculty", "Home", new { id = 3 }, null)</li>
<li>@Html.ActionLink(Resource.Faculty_Five, "Faculty", "Home", new { id = 5 }, null)</li>
</ul>
</div>
<div class="col-sm-6">
<div class="divider"></div>
<ul class="menu">
<li>@Html.ActionLink(Resource.Faculty_Two, "Faculty", "Home", new { id = 2 }, null)</li>
<li>@Html.ActionLink(Resource.Faculty_Four, "Faculty", "Home", new { id = 4 }, null)</li>
<li>@Html.ActionLink(Resource.Faculty_Six, "Faculty", "Home", new { id = 6 }, null)</li>
</ul>
</div>
</div>
</div>
</div>


I am trying to do the same but not quite sure what element to open close where/when e.g.

<div class="row">
<div class="col-lg-4 col-md-3 hidden-sm">
<h4>@Resource.Title</h4>
<p>@Resource.Header_Date</p>
<img src="~/Content/Images/student.png" alt="student" />
</div>
<div class="col-lg-8 col-md-9">
<h4>@Resource.Header_ListTitle</h4>
<div class="row">
@foreach (var item in Model)
{
if (counter != 0 && counter % 2 == 0)
{
@:</li>
@:<li>
}
<div class="col-sm-6">
<div class="divider"></div>
@* what to do here? *@
</div>
counter++;
}
</div><!-- /end row -->


It's totally confusing. Thank you for your help in advance.

Answer

This is what i ended with:

<div class="row">
    <div class="col-lg-4 col-md-3 hidden-sm">
            <h4>@Resource.Title</h4>
            <p>@Resource.Header_Date</p>
            <img src="~/Content/Images/student.png" alt="student" />
    </div>
        <div class="col-lg-8 col-md-9">
            <h4>@Resource.Header_ListTitle</h4>
            <div class="row">
             <div class="col-sm-6">
                <div class="divider"></div>
                <ul class="menu">
                   @foreach (var item in Model.Where(e => e.ID % 2 == 0))
                   {
                    <li>@Html.ActionLink(item.FacultyName, "Faculty", "Home", new { id = item.ID }, null)</li>
                   }
            </ul>
            </div>
            <div class="col-sm-6">
                <div class="divider"></div>                                                                                    
                <ul class="menu">
                   @foreach (var item in Model.Where(e => e.ID % 2 != 0))
                   {
                    <li>@Html.ActionLink(item.FacultyName, "Faculty", "Home", new { id = item.ID }, null)</li>
                   }
            </ul>
           </div>
       </div>
</div>
</div>

Actually it was much simpler than i thought. Thank you guys for all inputs. It's much appreciated