Clear button for calendar

[JellyRaptorParticipant]

I am trying to make a simple clear button for a jqxCalendar (having selectionMode ‘range’) in an angular spa using jqwidgets 4.2.1. I want the button to be disabled if there is nothing selected (and therefore nothing to clear). Here is my markup.

<jqx-calendar ng-model=”vm.dates” jqx-instance=”vm.calendar” jqx-settings=”{width:200, selectionMode: ‘range’}”><jqx-calendar>
<button ng-click=”vm.calendar.clear()” ng-disabled=”!vm.calendar.selectedDate”>Clear</button>

vm.calendar.selectedDate is undefined at first, so the button is disabled as expected. The variable vm.calendar.selectedDate updates just fine when the user executes a single click on a date. I would thus expect angular to have triggered a re-evaluation of the expression in ng-disabled and disable the button. It doesn’t, however, and it doesn’t seem that a single click on the calendar triggers any kind of angular event or even the change event of the widget. After selecting a range (2 clicks), the normal angular digest is triggered and re-evaluation occurs.

My question boils down to…how do I programatically respond to a single user click of a jqxCalendar? Do I have to manually put a watch on the vm.calendar.selectedDate?

[HristoParticipant]

Hello JellyRaptor,

You could bind to basic event click on the jqxCalendar (<jqx-calendar jqx-on-click="simpleClick(event)">)

Best Regards,
Hristo Hristov

jQWidgets team
http://www.jqwidgets.com

[Author]

Posts