Html div inside foreach loop issue in MVC 5

Question

1.00/5 (2 votes)

See more:

I am working on MVC 5 project, there is view and partial page. After using foreach loop happening unwanted empty

Below screen shot please find the image.

[^]

[^]

Here is html view on browser, below screen shot please find the image.

[^]

What I have tried:

I have tried,

Here is View page with foreach loop.

HTML

<div class="board-canvas m-t-20">
                       <div id="board" class="u-fancy-scrollbar js-no-higher-edits js-list-sortable ui-sortable">
                           @foreach (var item in Model)
                           {
                               <div class="js-list list-wrapper list-padding u-fancy-scrollbar">
                                   <ul class="offered-list">

                                       @if (item.idParentService == 0)
                                       {
                                           <li>
                                               <div class="checkbox ">
                                                   <label class="hd-txt"><input type="checkbox" class="chk_Service" value="@item.idService">@item.ServiceName</label>
                                               </div>
                                           </li>
                                       }

                                       <li>
                                           @Html.Partial("_servicesOffered", item)
                                       </li>

                                   </ul>
                               </div>
                           }
                       </div>
                   </div>

This is partial view '_servicesOffered' content.

HTML

@model Rebox.BIL.DataModel.ServiceListTreeBL

@foreach (var item in Model.servicesList)
{
    <ul class="offered-sub-list">
        @if (item != null)
        {
            <li>
                <div class="checkbox ">
                    <label><input type="checkbox" class="chk_Service" value="@item.idService">@item.ServiceName</label>
                    @if (item.servicesList.Count > 0)
                    {
                        @Html.Partial("_servicesOffered", item)
                    }
                </div>
            </li>
        }
    </ul>
}

How can I do this?

Please help me...

Posted 23-Feb-17 22:40pm

Rajesh Kumar 2013

Updated 21-Jun-17 5:24am

v2

Add a Solution

Comments

F-ES Sitecore 24-Feb-17 5:14am

That code can't generate the html you're seeing. Also the html you posted is from the browser's dev tools, it is the html after any javascript has run, so I suspect you have javascript somewhere that is removing the contents of the li tags. View the actual page source via the menus rather than using F12.

Bryian Tan 24-Feb-17 20:31pm

Did you debug to check if any element in Model object?

Rajesh Kumar 2013 24-Feb-17 22:49pm

@Bryian Tan : Yes! All Model object are filled with data not any null referred.

sachin.vishwa90 28-Feb-17 8:53am

mark it solved

Rajesh Kumar 2013 28-Feb-17 8:57am

@Sachin.vishwa90 : how can Mark it solved. I did accept you answer. Is it okay?

2 solutions

Solution 2

I have encountered the same problem, with a null object ("on save") after running a foreach loop. I changed the foreach loop to a "for" loop and the problem went away.

My Original code:

@foreach (var item in Model.ContractorLocationData)
                   {
                       <tr>
                           <td>@Html.DropDownListFor(m => item.AddressType, WebMXT.MVC.Controllers.SystemManagementController.GetBusinessLocationType(), item.AddressType)</td>
                           <td>@Html.EditorFor(m => item.AddressLine1)</td>
                           <td>@Html.EditorFor(m => item.AddressLine2)</td>
                           <td>@Html.EditorFor(m => item.City)</td>
                           <td>@Html.DropDownListFor(m => item.StateCode, WebMXT.MVC.Controllers.SystemManagementController.GetStateCodeDropDown(), item.StateCode)</td>
                           <td>@Html.EditorFor(m => item.ZipCode)</td>
                           <td>@Html.DropDownListFor(m => item.CountryCode, WebMXT.MVC.Controllers.SystemManagementController.GetCountryCodeDropDown(), item.CountryCode, new { style = "max-width: 200px" })</td>
                           <td>@Html.EditorFor(m => item.PhoneNumber)</td>
                           <td>@Html.EditorFor(m => item.CommercialFaxNumber)</td>
                           <td>
                               @Html.ActionLink(" ", "DeleteLocation",
                              "SystemManagement",
                              new { locationSeq = item.ContractorLocationSeq, contractNumber = @Model.CageCode },
                              new
                              {
                                  @onclick = "return confirm('Are you sure you want to delete this Location');",
                                  @class = "glyphicon glyphicon-remove"
                              })
                           </td>
                           <td>@Html.HiddenFor(m => item.ContractorLocationSeq)</td>
                           <td></td>

                       </tr>
                   }

Working code:

@for (int i = 0; i < Model.ContractorLocationData.Count; i++)
  {
      <tr>
          <td>@Html.DropDownListFor(m => m.ContractorLocationData[i].AddressType, WebMXT.MVC.Controllers.SystemManagementController.GetBusinessLocationType(), Model.ContractorLocationData[i].AddressType)</td>
          <td>@Html.EditorFor(m => m.ContractorLocationData[i].AddressLine1)</td>
          <td>@Html.EditorFor(m => m.ContractorLocationData[i].AddressLine2)</td>
          <td>@Html.EditorFor(m => m.ContractorLocationData[i].City)</td>
          <td>@Html.DropDownListFor(m => m.ContractorLocationData[i].StateCode, WebMXT.MVC.Controllers.SystemManagementController.GetStateCodeDropDown(), Model.ContractorLocationData[i].StateCode)</td>
          <td>@Html.EditorFor(m => m.ContractorLocationData[i].ZipCode)</td>
          <td>@Html.DropDownListFor(m => m.ContractorLocationData[i].CountryCode, WebMXT.MVC.Controllers.SystemManagementController.GetCountryCodeDropDown(), Model.ContractorLocationData[i].CountryCode, new { style = "max-width: 200px" })</td>
          <td>@Html.EditorFor(m => m.ContractorLocationData[i].PhoneNumber)</td>
          <td>@Html.EditorFor(m => m.ContractorLocationData[i].CommercialFaxNumber)</td>
          <td>
              @Html.ActionLink(" ", "DeleteLocation",
             "SystemManagement",
             new { locationSeq = Model.ContractorLocationData[i].ContractorLocationSeq, contractNumber = @Model.CageCode },
             new
             {
                 @onclick = "return confirm('Are you sure you want to delete this Location');",
                 @class = "glyphicon glyphicon-remove"
             })
          </td>
          <td>@Html.HiddenFor(m => m.ContractorLocationData[i].ContractorLocationSeq)</td>
      </tr>
  }

Posted 21-Jun-17 5:24am

Member 11078564

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

sachin.vishwa90 · Accepted Answer · 2017-02-26T19:07:00

Solution 1

you are calling the same partial view again in the partial view, is that your desired functionality ?

Posted 26-Feb-17 19:07pm

sachin.vishwa90

Comments

Rajesh Kumar 2013 27-Feb-17 23:03pm

Hello All, It was my c# coding logical mistake. Now I can solved it. Thank you for everyone to reply me.