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; 
     } 

私を助けてください。 Googleで結果が見つかりませんでした。

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; 
}