asp.net-mvc - 如何在 DHTMLX 控件事件调度程序中设置文本颜色和背景

Question

我想在 DHTMLX 控件事件调度程序中的文本/背景上显示不同的颜色。所以下面是我的代码，我只是传递虚拟数据-

 public ActionResult Index()
        {
            var scheduler = new DHXScheduler(this);
            scheduler.Skin = DHXScheduler.Skins.Flat;
            scheduler.Config.multi_day = true;
            scheduler.InitialDate = new DateTime(DateTime.Now.Year, DateTime.Now.Month, DateTime.Now.Day);
            scheduler.LoadData = true;
            scheduler.EnableDataprocessor = true;
            return View(scheduler);
        }


  public ContentResult Data()
        {
            var data = new SchedulerAjaxData(
                new List<CalendarEvent>{
                    new CalendarEvent{
                        id = 1,
                        text = "Sample Event",
                        start_date = new DateTime(2017, 04, 09, 3, 00, 00),
                        end_date = new DateTime(2017, 04, 09, 4, 00, 00)

                    },
                    new CalendarEvent{
                        id = 2,
                        text = "Event Anniversery",
                         start_date = new DateTime(2017, 04, 08, 6, 00, 00),
                        end_date = new DateTime(2017, 04, 08, 8, 00, 00)
                    },
                    new CalendarEvent{
                        id = 3,
                        text = "Third Event",
                         start_date = new DateTime(2017, 04, 07, 8, 00, 00),
                        end_date = new DateTime(2017, 04, 07, 9, 00, 00)
                    }
                }
            );
            return (ContentResult)data;
        }

请帮我。我在谷歌上没有找到任何结果。

Answer 1

你检查过这篇文章http://scheduler-net.com/docs/custom-color.html吗？

简而言之，您可以将颜色存储在事件对象的属性中：

public class Event
{
    public int id { get; set; }
    public string text { get; set; }
    public DateTime? start_date { get; set; }
    public DateTime? end_date { get; set; }
    public string color { get; set; }
    public string textColor { get; set; }
}

数据：

new CalendarEvent{
    id = 1,
    text = "Sample Event",
    start_date = new DateTime(2017, 04, 09, 3, 00, 00),
    end_date = new DateTime(2017, 04, 09, 4, 00, 00),
    color = "#FF0000",
    textColor = "#FFFFFF"
}

或者您可以基于其他属性将 css 类附加到事件元素：

Javascript：

scheduler.templates.event_class = function(start, end, event){
    if(event.someProperty){
        return "colored-event";
    }
    return "";
};

CSS：

/*event in day or week view*/
.dhx_cal_event.colored-event div{
    background-color: #FF0000 !important;
    color: #FFFFFF !important;
}

/*multi-day event in month view*/
.dhx_cal_event_line.colored-event{
    background-color: #FF0000 !important;
    color: #FFFFFF !important;
}

/*single-day event in month view*/
.dhx_cal_event_clear.colored-event{
    color: #FF0000 !important;
}