添加事件或删除事件后,JQM日历未刷新

时间:2014-08-23 13:39:04

标签: jquery jquery-mobile cordova calendar

我在我的phonegap应用https://github.com/JWGmeligMeyling/jqm-calendar中使用以下日历插件进行日历活动

我的应用程序我允许用户添加事件事件,添加的事件将保存到数据库以供功能使用,并允许用户在服务的帮助下从服务器中删除事件

如果用户添加或删除事件意味着我将重新加载我的阵列并刷新日历。

如果我重新加载数组并刷新日历意味着在我点击下一个或上一个按钮之前它不会令人耳目一新

我正在使用以下行在 pageshow

中刷新我的日历

刷新代码: $(“#calendar”)。触发器('刷新');

为了清楚地说明问题,我的页面显示附上了我的代码

$.mobile.document.on( "pagebeforeshow", "#view-calendar", function() {

if(vcal){
alert("pgshow");
$("#calendar").trigger('refresh');
}
$('#addcal').on( "tap", function( event ) {
eventflag=false;
$.mobile.changePage("#add-calendar");
});
$.mobile.loading( 'show');

var eventsss;
var uid= localStorage.getItem('uid');

var ss='data={"uid":"'+uid+'"}';

$.ajax({
url:"http://trendy.twomini.com/pinapp/index.php/version/listevent",
type:'POST',
data:ss,
cache: true,
dataType: 'text',
crossDomain: true,
ContentType:"application/x-www-form-urlencoded; charset=UTF-8",
error: function(XMLHttpRequest,textStatus, errorThrown) {
var res=JSON.stringify(XMLHttpRequest);
var datareg = JSON.parse(res);
console.log(datareg);
$("#calendar").jqmCalendar();
},
success: function (data) {
$.mobile.loading( 'hide');
var data=eval('('+data+')');
eventnamearr=[];


var startdate;
var enddate;
$.each(data.msg, function(i,item){

var str =item.start_date;
var str1 =item.end_date;
var res = str.split(" ");
var res1 = str1.split(" ");

var id=item.id;


startdate=res[3]+'-'+convertMonthNameToNumber(res[1])+'-'+res[2]+' '+res[4];
enddate=res1[3]+'-'+convertMonthNameToNumber(res1[1])+'-'+res1[2]+' '+res1[4];


eventsss={"summary":item.event_name,"begin":new Date(startdate),"end":new Date(enddate),"id":item.id,"location":item.location};
eventnamearr.push(eventsss);





});
$("#calendar").jqmCalendar({
events : eventnamearr, // Point to the events array now
months : ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"],
days : ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"],
startOfWeek : 0
});


}

});
});

2 个答案:

答案 0 :(得分:0)

Pagebeforeshow仅在通过JQM重定向时发生。您应该添加与修改日历内容的事件相关联的刷新。

答案 1 :(得分:0)

您正在多次初始化日历,目前设置未使用上述方式更新。您应该初始化日历一次,指向一系列事件,然后推送到该数组:

// Create an array that will contain the events
var eventsArray = [];

// Dynamically add events to the array (this can be done later on as well)
eventsArray.push({ "summary" : "Test event", "begin" : new Date(), "end" : new Date() }); 

// Initialize the calendar
$("#calendar").jqmCalendar({
   events : eventsArray, // Point to the events array now
   months : ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"],
   days : ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"],
   startOfWeek : 0
}); 

// Add another event
eventsArray.push({ "summary" : "Test event", "begin" : new Date(), "end" : new Date() }); 

// Trigger refresh
$('#calendar').trigger('refresh');

来源:问题类似于https://github.com/JWGmeligMeyling/jqm-calendar/issues/12