Pulling single elements for headers from a List Model

Question

I have a List Model with several rows. In the Model , I would like to pull out certain parts to display in the top of the page, some as titles for the data and then the data parts itself. When I pull this List or IEnumeration to the view it will display all data as expected, but not able to display First() or any other way of getting these headers out. Should I go about the View display another way?

Goal:
Header row with Event name and Date (currently in each row of the list) Groups or tables of data with their own headers based also on data in the List The data detail per the group above.

I have a partial view to loop through the core data..

Advice please?

Code is messy, but here it is:

View

@model IEnumerable<eManager.Web2.Models.EventClassCompListVM>

@{
    ViewBag.Title = "EventCompClassReport";
}

<h2>EventCompClassReport</h2>


<table class="table">

    @Html.DisplayFor(model => model.EventName) //Tried several ways to identify this, but it is in the List so no way to single it out.


        @Html.EditorForModel()

}

</table>

Partial View (Works as expected looping through the List)

@model eManager.Web2.Models.EventClassCompListVM
<tr>
    <td>
        @Html.DisplayFor(modelItem => Model.Comp_EventID)
    </td>
    <td>
        @Html.DisplayFor(modelItem => Model.CompName)
    </td>
    <td>
        @Html.DisplayFor(modelItem => Model.ClassName)
    </td>
    <td>
        @Html.DisplayFor(modelItem => Model.ClassOrder)
    </td>
    <td>
        @Html.DisplayFor(modelItem => Model.IsCrossOver)
    </td>
</tr>    

Controller Class (although its simply returning several rows of data)

 public ActionResult BuildEventClassReports()
        {
            var model = from o in _db.Events
                           join o2 in _db.Event_Classes on o.EventID equals o2.EventID
                           where o.EventID.Equals(o2.EventID)
                           join o3 in _db.Event_Class_Compeditors_s on o2.EventClassID equals o3.EventClassID
                           where o2.EventClassID.Equals(o3.EventClassID)
                           join o4 in _db.Compeditors on o3.CompeditorId equals o4.CompeditorId
                           where o3.CompeditorId.Equals(o4.CompeditorId)
                           join o5 in _db.Class_Definitions on o2.ClassID equals o5.Class_Definition_ID
                           where o2.ClassID.Equals(o5.Class_Definition_ID)
                           where o.CurrentEvent.Equals(true)
                           orderby o2.ClassOrder
                           //orderby o3.Comp_EventID

                           select new EventClassCompListVM { 
                                                            EventName = o.EventName,
                                                            EventDate = o.Date_End,
                                                            ClassName = o5.Class_Name,
                                                            Comp_EventID = o3.Comp_EventID,
                                                            ClassOrder = o2.ClassOrder,
                                                            CompName = (o4.FirstName + " " + o4.LastName),
                                                            IsCrossOver = o3.IsCrossOver };

            return View(model);

EDIT:

Some new code that has gotten me much closer.. But I cannot see how to get a few data parts out of the first foreach. The line of code @Html.Display is just not working.. the text "mumbo Jumbo" works great and splits up the groups. Any help is appreciated.!!

Current view code:

   <h2>
        @(Model.Any() ? Model.First().EventName : "")
        @(Model.Any() ? Model.First().EventDate.ToShortDateString() : "")

    </h2>

        @foreach (var group in Model.GroupBy(item => item.ClassID))
                {
                        <tr><td><b>mumbo jumbo</b>
                            </td></tr>
            @Html.DisplayFor(modelItem => Model.ClassName) //Cannot get this line to work. 

                    foreach (var item in group)
                    {
                        <tr>
                            <td>
                                @Html.DisplayFor(modelItem => item.Comp_EventID)
                            </td>
                            <td>
                                @Html.DisplayFor(modelItem => item.CompName)
                            </td>
                            <td>
                                @Html.DisplayFor(modelItem => item.ClassName)
                            </td>
                            <td>
                                @Html.DisplayFor(modelItem => item.ClassOrder)
                            </td>
                            <td>
                                @Html.DisplayFor(modelItem => item.IsCrossOver)
                            </td>
                        </tr>

                    }

                }

Answer 1

I'm sure there's a better way to do this, but what I can think of right now is to store the titles as a separate list.

Create a new class as the model for the view and include a list of the titles together with the data. eg

public class MainViewModel
{
    public IEnumerable<string> Titles { get; set;}
    public IEnumerable<eManager.Web2.Models.EventClassCompListVM> Models { get; set;}
}

Populate this class accordingly in your BuildEventClassReports() action, and pass this class to the view.

You can then pass Model.EventClassCompListVM to the partial view using a @Html.Partial("viewname", Model.EventClassCompListVM)