我正在尝试使用 Sencha Touch 日历扩展(http://www.sencha.com/forum/showthread.php?156351-Ext.ux.TouchCalendar)这是我使用的示例:http:// www.swarmonline.com/Ext.ux.TouchCalendar/examples/simple-events-list.html
我在这里面临一个问题。当应用程序第一次加载时,事件点丢失了..但是当我调整浏览器窗口的大小时,突然发生了一些事件调用,点变得可见,同时它也重复了..
我正在使用他们的简单事件插件。这是我的视图结构
Ext.define('WinReo.view.EventListPanel', {
extend: 'Ext.Panel',
//xtype:'EventListPanel',
requires: [
'Ext.dataview.List',
'Ext.layout.Fit'
],
alias: 'widget.EventListPanel',
config: {
// title : 'Events List',
layout : 'fit',
store:'WinReo.store.Events'
},
initialize: function(){
var store = Ext.getStore('Events');
store.load({
callback: function(records, operation, success) {
// the operation object contains all of the details of the load operation
console.log(records);
},
scope: this
});
this.callParent(arguments);
this.setItems([
{
xclass : 'Ext.ux.TouchCalendarView',
itemId : 'calendarView',
//minDate : Ext.Date.add((new Date()), Ext.Date.DAY, -40),
//maxDate : Ext.Date.add((new Date()), Ext.Date.DAY, 55),
viewMode : 'month',
weekStart : 0,
value : new Date(),
eventStore : Ext.getStore('Events'),
plugins : [Ext.create('Ext.ux.TouchCalendarSimpleEvents')]
/* plugins : [Ext.create('Ext.ux.TouchCalendarEvents', {
eventBarTpl: '{Days2Go}'
})]*/
},
{
xtype : 'list',
itemId : 'calendarlist',
docked : 'bottom',
onItemDisclosure:'true',
cls:'myList',
height : 100,
itemTpl : ['<tpl if ="Days2Go==0">',
'<div class="calendarlistred"> <div style="float:left; width: 45%">{PropertyAddr}</div><div style="float:left; width:45%">{TaskDesc}</div><div style="float:right; width:10%">{Days2Go}</div></div>',
'</tpl>',
'<tpl if ="Days2Go!=0">',
'<div> <div style="float:left; width: 45%">{PropertyAddr}</div><div style="float:left; width:45%">{TaskDesc}</div><div style="float:left; width:10%">{Days2Go}</div></div>',
'</tpl>'
],
store : Ext.create('Ext.data.Store', {
model: 'WinReo.model.Event',
data: []
}),
listeners: {
itemtap: function(dw, index,record, item, e){
window.open('http://blr.amt.in:8081/CRM_API/TaskCalendar.ashx?all_tasks=-1');
}
}
},
{
xtype : 'label',
html: '<div> <div style="float:left; width: 45%">Property</div><div style="float:left; width:45%">Task Description</div><div style="float:right; width:10%">Days to go</div></div>',
layout:'hbox',
docked : 'bottom',
cls:'calendarlistheader'
}
]);
}
});
另外我想知道 TouchCalendarSimpleEvents.js 中有函数
refreshEvents: function(){
if (!this.disabled && this.calendar.getViewMode() !== ‘DAY’) {
var datesStore = this.calendar.getStore();
…..
how can i call this function in my periodchange controller event ?
onPeriodChange: function(view, minDate, maxDate, direction){
Ext.Ajax.setDefaultHeaders({
'session_id' : localStorage.getItem("session_id")
});
console.log('periodchange');
console.log(view);
console.log(minDate);
var monthstartdate = Ext.Date.format(minDate, 'm/d/Y');
var url = 'http://blr.amt.in:8081/CRM_API/TaskCalendar.ashx?';
var urlafter = url + 'monthstartdate='+ monthstartdate;
// proxy change
var group_store = Ext.getStore("Events");
group_store.getProxy().setUrl(urlafter);
group_store.load();
var storecount = group_store.getCount();
this.refreshEvents(); // ***here i want to call refresh function***
}
非常感谢您的帮助。