Comments (7)
@chandan4871 Not sure how you bind data to the calendar.
The event source change is watched at the variable level, if you directly modify the element in the event source, the refresh won't be triggered because of the performance consideration.
You can check the README for more detail.
To force refresh, you can manually broadcast the event.
$scope.$broadcast('eventSourceChanged',$scope.eventSource);
from ionic-calendar.
.controller('BDCalendar',function($scope,$firebaseArray,$ionicLoading){
$scope.show = function() {
$ionicLoading.show({
template: '
Loading...
'});
};
$scope.hide = function(){
$ionicLoading.hide();
};
$scope.calendar = {};
$scope.changeMode = function (mode) {
$scope.calendar.mode = mode;
};
$scope.loadEvents = function () {
$scope.calendar.eventSource = createRandomEvents();
$scope.$broadcast('eventSourceChanged',$scope.calendar.eventSource);
};
$scope.loadEvents();
$scope.onEventSelected = function (event) {
console.log('Event selected:' + event.startTime + '-' + event.endTime + ',' + event.title);
};
$scope.onViewTitleChanged = function (title) {
$scope.viewTitle = title;
};
$scope.today = function () {
$scope.calendar.currentDate = new Date();
};
$scope.isToday = function () {
var today = new Date(),
currentCalendarDate = new Date($scope.calendar.currentDate);
today.setHours(0, 0, 0, 0);
currentCalendarDate.setHours(0, 0, 0, 0);
return today.getTime() === currentCalendarDate.getTime();
};
$scope.onTimeSelected = function (selectedTime) {
console.log('Selected time: ' + selectedTime);
};
function createRandomEvents() {
$scope.show();
String.prototype.replaceAll = function(s,r){return this.split(s).join(r)}
var prospect = new Firebase(url);
var exploration = new Firebase(url);
var follow = new Firebase(url);
var tender = new Firebase(url);
var urlArray=[];
urlArray=[prospect,exploration,follow,tender];
var prpData=[];
var expData=[];
var followdata=[];
var tenData=[];
var j=0;
var k=0;
var l=0;
var m=0;
for(var i=0;i<4;i++){
if(i==0)
{
urlArray[0].on('value', function (snapshot) {
var quakes = [];
snapshot.forEach(function (childSnapshot) {
quakes.push(childSnapshot.val());
prpData.push(quakes[j].PROP_SUB);
prpData.push((quakes[j].PROP_DT).replaceAll("-", ","));
j++;
});
addEvent(prpData);
});
}
else if(i==1)
{
urlArray[1].on('value', function (snapshot) {
var quakes1 = [];
snapshot.forEach(function (childSnapshot) {
quakes1.push(childSnapshot.val());
expData.push(quakes1[k].EXP_SUB);
expData.push((quakes1[k].EXP_DT).replaceAll("-", ","));
k++;
});
addEvent(expData);
});
}
else if(i==2)
{
urlArray[2].on('value', function (snapshot) {
var quakes2 = [];
snapshot.forEach(function (childSnapshot) {
quakes2.push(childSnapshot.val());
followdata.push(quakes2[l].FU_SUB);
followdata.push((quakes2[l].FU_DT).replaceAll("-", ","));
l++;
});
addEvent(followdata);
});
}
else if(i==3)
{
urlArray[3].on('value', function (snapshot) {
var quakes3 = [];
snapshot.forEach(function (childSnapshot) {
quakes3.push(childSnapshot.val());
tenData.push(quakes3[m].TEN_SUB);
tenData.push((quakes3[m].TEN_SUB_DT).replaceAll("-", ","));
m++;
});
addEvent(tenData);
});
}
}
var events = [];
function addEvent(eventarray)
{
var startTime,endTime,tittle;
for(var l=0;l<=eventarray.length;l++)
{
if(l%2 != 0)
{
startTime = new Date(eventarray[l]);
endTime = new Date(startTime.getFullYear(),startTime.getMonth(),startTime.getDate()+1);
tittle=eventarray[l-1];
}
events.push({
title: tittle,
startTime: startTime,
endTime: endTime,
allDay: true
});
}
$scope.hide();
}
return events;
}
});
from ionic-calendar.
Above code is my controller i have four table in my firebase database i have extract the subject and date from the 4 tables and already bind them to calendar so where should i write the $scope.$broadcast('eventSourceChanged',$scope.eventSource); that the calendar will refresh automatically and display the event.please go through the above code and help me it will be great pleasure for me.
from ionic-calendar.
@chandan4871
Are your database call executed asynchronously?
You need to call the broadcast method right after you made change to eventSource.
from ionic-calendar.
@chandan4871 I had the same problem. Because I needed to refresh the events when the function $scope.onViewTitleChanged was called. To resolve it I copy and paste whole code into the function $scope.onViewTitleChanged. Like that:
$scope.onViewTitleChanged = function (title) {
dateWeekStart = new Date(title);
$scope.titleMonth = months[dateWeekStart.getMonth()];
strDateWeekStart = title;
var eventsBD = [];
if($scope.calendar.eventSource !== undefined) {
var eventsCalendarBD = [];
$http.get('url_api').then(function (response) {
eventsBD = response.data;
var startTime;
var endTime;
for (var i = 0; i < eventsBD.length; i++) {
var eventArray = null;
eventArray = eventsBD[i];
var textStartDateTime = eventArray.start_date + " " + eventArray.start_hour;
var textEndDateTime = eventArray.end_date + " " + eventArray.end_hour;
startTime = new Date(textStartDateTime);
endTime = new Date(textEndDateTime);
eventsCalendarBD.push({
title: eventArray.subject,
startTime: startTime,
endTime: endTime,
allDay: false,
color: eventArray.room.color,
detail: eventArray
});
}
$scope.$broadcast('eventSourceChanged', eventsCalendarBD);
}, function (error) {
console.log("Error");
});
}
from ionic-calendar.
@cristhianbarros
rangeChanged method should be the most suitable one to use.
In that method, you will get the startTime and endTime of a range.
$scope.rangeChanged = function (startTime, endTime) {
Events.query({startTime: startTime, endTime: endTime}, function(events){
$scope.eventSource=events;
});
};
But in onViewTitleChanged, the only parameter is title.
It seems you don't need to leverage the startTime and endTime parameter, because you are querying like this: $http.get('url_api'). I guess your backend just returns all the events. It's a bit wasted if you query a lot of events, but only display the events in a small range.
from ionic-calendar.
@chandan4871 Not sure how you bind data to the calendar.
The event source change is watched at the variable level, if you directly modify the element in the event source, the refresh won't be triggered because of the performance consideration.
You can check the README for more detail.
To force refresh, you can manually broadcast the event.$scope.$broadcast('eventSourceChanged',$scope.eventSource);
It is not working inside http calls.
from ionic-calendar.
Related Issues (20)
- Add bullets to the calendar events instead of background color HOT 1
- Runtime Error - Cannot not read property 'currentDate' of undefined
- How to select multiple events on same date HOT 1
- how did you implemented that tamplate HOT 1
- change the event color HOT 1
- How to change the viewTitle format for day HOT 4
- Refresh events on calander HOT 3
- view to a particular date HOT 4
- Will it work in a cordova project HOT 1
- How to move a day forward and backward with my own inputs? HOT 3
- How to highlight current day in week mode? HOT 3
- Not able to display month events HOT 5
- How to edit week.html and day.html? HOT 1
- EventSourceChanged not working. HOT 1
- Date format HOT 1
- Sliding Issue HOT 1
- Mark Dot Indicator For Event List length on monthviewEventDetailTemplate HOT 1
- not able to customise the style for cell HOT 1
- Dynamic step HOT 1
- upgrade to angular 16.x and ionic 5.x HOT 1
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from ionic-calendar.