I'm using Angular 12.0 Calendar and I want to hide the text that shows the day of the month on week view. I've dug through the code and tried looking online but can't find the location of what makes this text appear. I am talking about this one https://mattlewis92.github.io/angular-calendar/#/kitchen-sink
not to be confused with material's.
example
Might be a bit late, but today I needed the same thing and I came out with this.
Docs might be hard to read, but you can find that almost every component inside the Angular Calendar has a templateRef (check this out: https://mattlewis92.github.io/angular-calendar/docs/components/CalendarWeekViewComponent.html#headerTemplate ).
<mwl-calendar-week-view [viewDate]="viewDate" [events]="events"
[hourSegmentTemplate]="weekViewHourSegmentTemplate"
[headerTemplate]="noDateHeaderTemplate"
(eventTimesChanged)="eventTimesChanged($event)" (eventClicked)="eventClicked($event)">
</mwl-calendar-week-view>
After that you need to set [headerTemplate] to a local ng-template. Personally I copied the default template hosted in the repo (you can find it here: https://github.com/mattlewis92/angular-calendar/blob/main/projects/angular-calendar/src/modules/week/calendar-week-view-header.component.ts
Related
I'm trying to render Material-UI calendar component without opening a dialog as demonstrated in all picker examples in material-ui-next demo page.
A similar question has been asked here, however the answer's import line doesn't apply anymore for beta version, and furthermore I couldn't find src files of beta version on github, nor the way to import pure calendar component.
Is it not possible to do such thing in v1 beta? If not, should I just use the older version?
Actually, I'm trying to use the calendar component under tab implementations like below, with different calendar dates pick range options as day, week, month, year; which I'll then try to implement out of that Calendar component I'm looking to render. So I thought finding out that component would be the first step to my solution.
Any help would be appreciated, thanks!
etc.
No it is not possible right now, and is a known issue. You can see it here: https://github.com/mui-org/material-ui/issues/4787 and https://github.com/mui-org/material-ui/issues/4796.
It is being discussed for a long time and probably will be in a release soon.
You can use a older version until that update or just use the modal with beta, until a new release.
I am using fullcalendar.js plugin and I believe it is great and fills my needs, except one feature that I need. This feature is to disable (better - hide, not display at all) arbitrary (custom) days from (at least) agendaWeek view. Now, I can only disable specific weekDays with hiddenDays option.
During research about it, I have only found this topic:
Setting Custom hiddenDays in Full Calendar
Which does not help me (it does not work, only disables (not "deletes, hides") days in month view.
Similar feature has been requested, but no response. https://github.com/fullcalendar/fullcalendar/issues/3130
So my question is, is there any way to achieve this? Either by hacking the JS code, or somehow modifying CSS with display: none? If so, which parts of the code I should look at and how, that could be modified to achieve my goal?
If anyone would have any idea I would be very grateful. Also I believe this feature could be useful for more people.
Thank you.
I am trying to create an interactive tutorial for learning an API. I've been googling my options for an entire day now. I came across ace, code mirror etc. but I'm not sure how I can use them in my case.
What I wish to do is that when the user clicks a button, a javascript code linked to it should open up in an editor on the same webpage. This would aid the users to see how the code is working and give them scope to modify and learn.
I know its not a constructive question but any help is appreciated! Thanks!
you can just wantch here how it is done
They made it with knockout MVVM but you can use angular or anything else you like.
I used tags to store my code and displayed it using codemirror's setValue property mentioned by #georg.
Hi I'm looking for a jQuery, JS, or PHP code that will allow me to display a calender with predetermined classes available for booking, i.e. a calender that displays the time of classes available at the local gym for each day and allows for possible bookings, even just allows an external link to another booking page would be ok. I've been looking for this for a few days now and have had no luck. My apologies if I'm using the wrong terminology and this has been covered many times before.
Regards,
Chris
Where I live a lot of gyms use https://www.mindbodyonline.com for class timetables and booking.
Example: http://www.thefitnessplayground.com.au/timetable
I am looking for some kind of example of a Javascript Time Picker that is similar to the one used in Windows to pick the time...well except with out the seconds being in their. I have a mockup in place at the moment but trying to figure out how some of the user functionality should be be as it is two inputs and a dropdown. I guess I just am not happy with it at this point.
Thanks ahead of time for any help
There are a number of jQuery plugins that you can use for the perfect looking time picker control.
Here is a good one: http://plugins.jquery.com/project/timepicker
The Windows time picker (if you're referring to the one to change the system clock) is basically just a masked edit text box. If you're looking for something similar, you just need some JavaScript to do masked edits, like this one:
http://digitalbush.com/projects/masked-input-plugin/
To make it specifically for time, you should be able to easily add logic to ensure the hours don't go over 12 (or 24), and the minutes don't go over 59.
Personally, I prefer the way Google Calendar does time selections. There is a jQuery plugin for this which can be found here:
http://labs.perifer.se/timedatepicker/
Here's a cool one.
http://www.java2s.com/Code/JavaScript/GUI-Components/FancyTimePicker.htm
An online example of the control is posted here.
Like Dan said, if you are looking for a masked text input and if you want to use the PrototypsJS framework, there is http://code.google.com/p/phenx-web/ .
And if you want a good date/time picker, you could use this : http://home.jongsma.org/software/js/datepicker (also PrototypeJS). I'm currently working on it with Jerermy Jongsma to add more features.
I'm pretty fond of the jQuery stuff, There is a fairly nice one here.
I ended up creating a prototype time picker that for the time being is less fancy than a lot of the others out there. It shows up a regular input until you click on it then it shows a dropdown that has times in it.
I can share the code if anyone is interested
A timepicker shouldn't slow down the user's interaction, should be pretty straightforward without having to play with it for a while, and should be keyboard-accessible for users who can't manipulate a mouse. The time-picking functionality provided by the Any+Time™ Datepicker/Timepicker AJAX Calendar Widget with TimeZone Support meets all of these design goals, supports countless date/time formats and is easy to customize using CSS or jQuery UI.
A good test of timepicker usability is to think of an odd time (say, 10:32pm) and then see how long it takes to accurately select that time using various time pickers. You can probably do it with Any+Time™ faster than you can even write out the time by hand... how's that for speed and ease of use? :-p