Comments (3)
Also it is possible to start another calendar and setting the current day to the next day based on the selected day of the previous calendar?
You should be able to add a change listener to the calendar and set the default date of the second calendar through the change event by grabbing the current date of the first calendar and adding some period of time to it.
from color-calendar.
I'm facing the same issue that the current date still remains active when I choose any other date than today.
Is there any fix for it?
from color-calendar.
EDIT:
It seems my original post have worked until the display: none
was applied. The calendar widget probably just can't handle that style. So another workaround is to apply this style intead of display: none
or visibility: hidden
and just toggle it to show or hide:
CSS
.size-invisible {
width: 0;
height: 0;
overflow: hidden;
}
Original post:
The problem seems to be caused by setting any kind of invisible style (display: none
or visibility: hidden
) on the container element node. The calendar does probably some kind of initialization during which the element must stay visible.
As an ugly workaround - you can set opacity: 0
to the calendar container and setTimeout
to disable opacity after set amount of time (after the initialization is probably finished) and just let the calendar be display: none
normally. E.g.:
HTML
<div id="calendar" class="opacity-1"></div>
JS
let calA = new Calendar({
id: "#calendar",
theme: "glass",
weekdayType: "long-upper",
startWeekday: 1,
monthDisplayType: "long",
headerBackgroundColor: "#b5b5b5",
calendarSize: "small",
layoutModifiers: ["month-left-align"],
dateChanged: (currentDate, events) => {
console.log('Clicked!')
},
monthChanged: (currentDate, events) => {
console.log("month change", currentDate, events);
}
});
setTimeout(() => {
$('#calendar').toggleClass('invisible').toggleClass('opacity-100')
}, 100)
from color-calendar.
Related Issues (20)
- Setting for bullets for each event on a current date HOT 1
- How to configure date month only picker
- Disable days HOT 1
- Getting data
- Allow "month change" by clicking on "other" days at the start/end of the displayed month.
- Error When Event Data is Added
- Customize weekend days HOT 1
- Events longer than 1 month are not displayed HOT 1
- Disable all the days before the currentDay HOT 1
- angular throws error HOT 1
- Please add more themes
- Is there any way to limit the date range? HOT 1
- Error TS2307: Cannot find module './types.d' or its corresponding type declarations. HOT 1
- Multiple selected dates in Safari HOT 4
- How to change event dots colors HOT 1
- Translate weekdays
- How can I add eventsData from a external json file? HOT 1
- Set date range to display
- Link of Demo1 in Readme.md file of color-calendar is not working.
- Current day and first day of newly toggled month are unclickable on mobile. HOT 4
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 color-calendar.