MVC: Displaying table data not working as expected

Question

I have this table in database:

I'm trying to display the the values (ModuleID and DateEntered) in the browser as table. I'm using viewbag to pass the value to my view, which is not quite the right way as I get just one row right now. What I'm doing right now is

public ActionResult Index()
        {
            var modules = (from entries in _db.Modules
                           orderby entries.DateEntered
                           select entries);
            ViewBag.entries = modules.ToList();
            return View();
        }

How can I get all rows from the table in above picture and pass it to view? In my view I currently have:

@using BootstrapSupport

    @model Sorama.DataModel.SIS.ModuleStock.Module

    @{
        ViewBag.Title = "Index";
        Layout = "~/Views/shared/_BootstrapLayout.basic.cshtml";
    }

    <table class="table table-striped">
        <caption></caption>
        <thead>
            <tr>
                <th>
                   Module ID
                </th>

                <th>
                    Date Entered
                </th>
            </tr>
        </thead>
        <tr>
             @foreach (var entry in ViewBag.entries)
            {
                <td>@entry.ModuleId</td>
                 <td>@entry.DateEntered</td>
            }
             <td>
                    <div class="btn-group">
                        <a class="btn dropdown-toggle" data-toggle="dropdown" href="#">
                            Action
                            <span class="caret"></span>
                        </a>
                        <ul class="dropdown-menu">
                                <li>@Html.ActionLink("Details", "Details")</li>
                                @if (Request.IsAuthenticated && HttpContext.Current.User.IsInRole("Admin"))
                                {
                                    <li class="divider"></li>
                                    <li>@Html.ActionLink("Edit", "Edit")</li>
                                    <li>@Html.ActionLink("Delete", "Delete")</li>
                                }



                        </ul>
                    </div>

                </td>
        </tr>

    </table>

This shows the values of entire row and not just (ModuleID and DateEntered) This is what I get in browser.

To sum up, I want to get all the rows from table but only specific columns. Which is not happening at current situation. Suggestions?

Answer 1

Try this

 public ActionResult Index()
    {
        ABCList abc=new ABCList();
        var modules = (from entries in _db.Modules
                       orderby entries.DateEntered
                       select new ABC {
                           id=entries.id,
                           ModuleTypeId=entries.ModuleTypeId,
                           ModuleId=entries.ModuleId,
                           DataEntered=entries.DataEntered
                        });
        abc.settings = modules.ToList();
        return View();
    }

  public class ABC
  {

    public long Id{ get; set; }
    public long ModuleTypeId{ get; set; }
    public string ModuleId{get;set;}
    public DateTime DataEntered{ get; set; }
  }

  public class ABCList{
    public List<ABC> Settings { get; set; }
  }

View

  @model ABCList
  @foreach (var entry in Model.Settings)
 {
 <tr>
    <td>@entry.ModuleId</td>
    <td>@entry.DateEntered</td>
    <td>
        <div class="btn-group">
            <a class="btn dropdown-toggle" data-toggle="dropdown" href="#">
                Action<span class="caret"></span>
            </a>
            <ul class="dropdown-menu">
                <li>@Html.ActionLink("Details", "Details")</li>
                @if (Request.IsAuthenticated && HttpContext.Current.User.IsInRole("Admin"))
                {
                    <li class="divider"></li>
                    <li>@Html.ActionLink("Edit", "Edit")</li>
                    <li>@Html.ActionLink("Delete", "Delete")</li>
                }       

            </ul>
        </div>    
    </td>
 </tr>
}

Answer 2

You misreading your results. There are 3 records with 2 fields each displayed in one row. You have single <tr> in your view and you insert values from ViewBag in <td> tags. You should put new <tr> for each of your record in ViewBag.

It should look more like this:

@foreach (var entry in ViewBag.entries)
{
    <tr>
        <td>@entry.ModuleId</td>
        <td>@entry.DateEntered</td>
        <td>
            <div class="btn-group">
                <a class="btn dropdown-toggle" data-toggle="dropdown" href="#">
                    Action<span class="caret"></span>
                </a>
                <ul class="dropdown-menu">
                    <li>@Html.ActionLink("Details", "Details")</li>
                    @if (Request.IsAuthenticated && HttpContext.Current.User.IsInRole("Admin"))
                    {
                        <li class="divider"></li>
                        <li>@Html.ActionLink("Edit", "Edit")</li>
                        <li>@Html.ActionLink("Delete", "Delete")</li>
                    }       

                </ul>
            </div>    
        </td>
    </tr>
}