簡體   English   中英

可擴展日歷v1.5.2和ExtJS v4.2中標記內的日歷數據

[英]Calendar data inside markup in Extensible Calendar v1.5.2 and ExtJS v4.2

我如何在活動中訪問日歷數據,我的意思是不在模板中,但在其他地方。 想法是,根據源自日歷存儲的“已確認”值更改模板。

這是我的代碼,但到目前為止還沒有運氣!

Ext.override(Extensible.calendar.view.DayBody, {
    getEventBodyMarkup: function() {
        if(!this.eventBodyMarkup) {

            // can't seem to get this section to work properly
            if (this.data.Confirmed === 1) // I need to access the event store in here...
                 var statusText='Ok';
            else 
                 var statusText='Ko';

            this.eventBodyMarkup = ['<p class="ellipsis">{Title}</br><strong>{ServiceName}</strong></br>'+statusText+'{Notes}</p>',
                '<tpl if="_isReminder">',
                    '<i class="ext-cal-ic ext-cal-ic-rem">&#160;</i>',
                '</tpl>',
                '<tpl if="_isRecurring">',
                    '<i class="ext-cal-ic ext-cal-ic-rcr">&#160;</i>',
                '</tpl>'
            ].join('');
        }
        return this.eventBodyMarkup;
    },
  }
);

誰能幫我嗎?

提前致謝!

這個帖子已經很老了,但是我最近遇到了這個問題,函數getEventBodyMarkup僅提供單獨的模板標記,並不為每個事件調用。 我對Extensible Calendar App不太熟悉,但是我的解決方案是重寫getTemplateEventData函數,這是您示例的快速解決方案,但請注意,我在ExtJs 3.4上運行v1.0-rc1,但是該過程可以輕松地適用於ExtJs 4 +

Ext.apply(Ext.ensible.cal.DayBodyView.prototype,{
  getEventBodyMarkup: function() {
    if(!this.eventBodyMarkup) {
      //just add a template variable/placeholder to your variable
      // in this case i choose _statusText
      this.eventBodyMarkup = ['<p class="ellipsis">{Title}</br>',
        '<strong>{ServiceName}</strong></br>{_statusText}{Notes}</p>',
          '<tpl if="_isReminder">',
            '<i class="ext-cal-ic ext-cal-ic-rem">&#160;</i>',
          '</tpl>',
          '<tpl if="_isRecurring">',
             '<i class="ext-cal-ic ext-cal-ic-rcr">&#160;</i>',
          '</tpl>'
      ].join('');
    }
    return this.eventBodyMarkup;
  }

  // now override the template data provider
  getTemplateEventData : function(evt){
    // --- 
    // essential code from the overwritten function
    // ---
    var M = Extensible.cal.EventMappings,
      extraClasses = [this.getEventSelectorCls(evt[M.EventId.name])],
      colorCls = 'x-cal-default';

    this.getTemplateEventBox(evt);

    if(this.calendarStore && evt[M.CalendarId.name]){
      var rec = this.calendarStore.getById(evt[M.CalendarId.name]);
      colorCls = 'x-cal-' + rec.data[Ext.ensible.cal.CalendarMappings.ColorId.name];
    }
    colorCls += (evt._renderAsAllDay ? '-ad' : '') + (Ext.isIE || Ext.isOpera ? '-x' : '');
    extraClasses.push(colorCls);

    if(this.getEventClass){
      var rec = this.getEventRecord(evt[M.EventId.name]),
      cls = this.getEventClass(rec, !!evt._renderAsAllDay, data, this.store);      
      extraClasses.push(cls);
    }

    // ---
    // Custom code starts here
    // ---
    var data = {}; // is going to store all your custom template vars

    if(this.getEventRecord(evt[M.EventId.name]).data.Confirmed===1) {
      data._statusText="OK";
    } else {
      data._statusText="Ko";
    }

    return Ext.applyIf(data, evt);
  }
});

希望您能明白,這可能不是最好的做法,但是它可以解決您的問題或其他遇到此問題的人。 確保您沒有覆蓋數據存儲區中的任何保留變量,我使用了Ext.applyIf(...)來防止此類事故的發生。

在模板中使用if條件:

this.eventBodyMarkup = ['<p class="ellipsis">{Title}</br><strong>{ServiceName}</strong></br>'
            '<tpl if="Confirmed==1">OK<tpl else>KO</tpl>{Notes}</tpl></p>',
            '<tpl if="_isReminder">',
                '<i class="ext-cal-ic ext-cal-ic-rem">&#160;</i>',
            '</tpl>',
            '<tpl if="_isRecurring">',
                '<i class="ext-cal-ic ext-cal-ic-rcr">&#160;</i>',
            '</tpl>'
        ].join('');

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM