2016-08-22 46 views
0

我實現了一個kendo敲除計劃程序, 所有事件都顯示正確,但我想顯示包含按鈕和消息的重定向到事件詳細信息的彈出窗口,當我點擊事件時 但我沒有找到如何做到這一點Kendo Knockout計劃程序顯示事件點擊自定義彈出框

這是我的js代碼

self.config = { 
     date: new Date(), 
     startTime: new Date("2016/8/09 00:00"), 
     endTime: new Date("2016/8/09 23:59"), 
     timezone: "Etc/UTC", 
     height: 800, 
     views: ["day", "week", "month", "agenda"], 
     editable: false, 
     selection: function() { 
      console.log("test selection") 
     }, 
     //eventTemplate: $(".fc-event-width-overirde").html(), 
     dataBound: function() { 
      var view = this.view(); 
      var events = this.dataSource.view(); 
      var eventElement; 
      var event; 


      //self.widgetEventDataSource.read(); 
      for (var idx = 0; idx < events.length; idx++) { 
       event = events[idx]; 

       //get event element 
       eventElement = view.element.find("[data-uid=" + event.uid + "]"); 

       //set the backgroud of the element 
       if (events[idx].color == "Low") { 
        eventElement.css("background-color", "#228B22"); 
       } else if (events[idx].color == "Medium") { 
        eventElement.css("background-color", "#FF8C00"); 
       } 
       else if (events[idx].color == "High") { 
        eventElement.css("background-color", "#FF0000"); 
       } 


      } 
     }, 
     dataSource: self.widgetEventDataSource, 
     autoBind: false, 
     navigate: function() { 
      //    var cur = this._current; 
      //    var prev = this._previous; 
      //    if (prev && cur && prev.getFullYear() !== cur.getFullYear()) { 
      //     alert("year change"); 
      //    } 
      //    this._previous = this._current; 


      var typeView = ""; 
      if ($(".k-state-hover").data() != undefined) { 
       typeView = $(".k-state-hover").data().name; 
      } 

      if (this.calendar != undefined) { 
       var dateCalendar = this.calendar._value 
      } 

      //var startDate = this.calendar._value; 
      self.widgetEventDataSource.read({ "typV": typeView, "dateCalendar": dateCalendar }); 
     } 

    }; 

這是我的HTML代碼

<div id="ostCalendar" data-bind="kendoScheduler: config"> </div> 

回答

相關問題