如何突出显示由asp.net mvc中的动态模型产生的文本？

Question

我正在显示时间表，我想突出显示当前在时间表中播放的项目。计划中的数据使用动态模型绑定来返回。我没有使用像telerik之类的任何网格。数据只是填充到div中。任何帮助将不胜感激。是否可以通过控制器来完成？

Answer 1

看看这个page.我相信这会帮助你。基本上你需要将模型设置为一个组，然后你可以通过javascript调用活动项目并执行你正在寻找的突出显示。

Answer 2

我想强调当前播放项目的进度

这里去用一个简单的三元操作上的观点我的解决方案。

比方说，如果你有一个简单的模型是这样 -

public class ScheduleViewModel 
{ 
    public string Name { get; set; } 
    public DateTime ScheduleTime { get; set; } 
} 

，按照下图你的控制器动作返回的计划时间为准。注意我们在列表中有不同的日期。

public ActionResult Index() 
    { 
     List<ScheduleViewModel> sch = new List<ScheduleViewModel>(); 
     sch.Add(new ScheduleViewModel() { Name = "Sch1", ScheduleTime = DateTime.Now.AddDays(-2) }); 
     sch.Add(new ScheduleViewModel() { Name = "Sch2", ScheduleTime = DateTime.Now }); 
     sch.Add(new ScheduleViewModel() { Name = "Sch3", ScheduleTime = DateTime.Now.AddDays(2) }); 
     return View(sch); 
    } 

然后在视图中，我们可以有下面的代码 -

@model IEnumerable<MVC.Controllers.ScheduleViewModel> 

@{ 
    ViewBag.Title = "Index"; 
} 

<h2>Index</h2> 

<p> 
    @Html.ActionLink("Create New", "Create") 
</p> 
<table class="table"> 
    <tr> 
     <th> 
      @Html.DisplayNameFor(model => model.Name) 
     </th> 
     <th> 
      @Html.DisplayNameFor(model => model.ScheduleTime) 
     </th> 
     <th></th> 
    </tr> 

@foreach (var item in Model) { 
    <tr> 
     <td> 
      @Html.DisplayFor(modelItem => item.Name) 
     </td> 
     <td> 
      @Html.LabelFor(modelItem => item.ScheduleTime, item.ScheduleTime.ToString(), new { style=item.ScheduleTime.Date == DateTime.Now.Date ? "background:green;" : "background:red;" }) 
     </td> 
    </tr> 
} 

</table> 

所以在上面的代码中，我们使用一个简单的三元运营商配发一个特定的风格，以当前日期的时间表。显示屏下面将像显示 -

对有日期时间对比，你可以有这样的事情 -

@Html.LabelFor(modelItem => item.ScheduleTime, item.ScheduleTime.ToString(), new { style = item.ScheduleTime == DateTime.Parse("2/18/2014 10:00:00") ? "background:green;" : "background:red;" }) 

这将使你下面的输出 -

只获得时间比较 -

@Html.LabelFor(modelItem => item.ScheduleTime, item.ScheduleTime.ToString(), new { style = item.ScheduleTime.ToString("HH:mm:ss") == new TimeSpan(10,0,0).ToString() ? "background:green;" : "background:red;" }) 

但我不认为你只需要时间比较，你需要比较日期和时间（如上所示）来完成您的需求。