How to display additional information from a database field in tool tip on Mouse Over of record in ASP.NET MVC

Question

I am displaying a list of products codes within a table, each product has its own size. I would like be able to hover ever the products and be able to view their own sizes. my approach towards this implementation did not work. I am in need of a helping hand. thanks in advance

ViewModel

  public class PTGIndexVM
{
    [Display(Name="Select Promotion")]
    public int PromotionId { get; set; }
    public List<SelectListItem> PromotionOptions { get; set; }
    public IList<EditPTG> IndexList { get; set; }
    public IList<String> ProductCodes { get; set; }
    public string wrapClass { get; set; }

    public List<SelectListItem> Size { get; set; }


    public PTGIndexVM()
    {
        IndexList = new List<EditPTG>();
        PromotionOptions = new List<SelectListItem>();
        ProductCodes = new List<String>();
        Size = new List<SelectListItem>();

        Setup();
    }

View

  <fieldset class="fieldset">
        <legend class="legend">Product To Grade Mappings</legend>
        <table class="promo full-width alternate-rows">
            <tr>
                <th>
                    @Html.DisplayNameFor(model => model.IndexList[0].grade.GradeString)
                </th>
                <th class="center-text">Frequency
                </th>
                @if (Model.IndexList.Count > 0)
                {
                    foreach (var code in Model.ProductCodes)
                    {

                    <th class="center-text" title="@Model.Size.">
                        @Html.DisplayFor(m => code)



                    </th>

                    }
                }
                <th>Actions</th>
            </tr>

Answer 1

To resolve my issues i had to reference the full table instead of the field itself which made it easier for me to display the data i want to see in the tooltip.

 public class PTGIndexVM
{
    [Display(Name="Select Promotion")]
    public int PromotionId { get; set; }
    public List<SelectListItem> PromotionOptions { get; set; }
    public IList<EditPTG> IndexList { get; set; }
    public IList<Product> Products { get; set; }
    public string wrapClass { get; set; }

    /// <summary>
    /// Members Setup
    /// </summary>
    public PTGIndexVM()
    {
        IndexList = new List<EditPTG>();
        PromotionOptions = new List<SelectListItem>();
        Products = new List<Product>();
        Setup();
    }

  vm.Products = productLogic
            .GetByAndInclude(x => x.PromotionID == PromotionId && x.WindowProduct == true && x.Active == true, new List<string>() { "Size", "ProductTemplate" })
            .Where(prod => allPTG.Any(x => x.ProductID == prod.ProductID))
            .OrderBy(prod => prod.ProductCode)
            .Select(prod => prod)
            .ToList();

 foreach (var product in Model.Products)
                    {
                    <th class="center-text" title="@product.ProductTemplate.Vertical (V) x @product.ProductTemplate.Horizontal (H)">
                        @Html.DisplayFor(m => product.ProductCode)
                    </th>
                    }
                }