JDate onClick Alert within Calendar Pop-up

[hominid4]

If I could revisit the post below that juuser was gracious enough to help with.

https://fabrikar.com/forums/index.p...ate_time-advanced-dates-for-choose-date.51922

I'm needing similar functionality again for another project but this time I need the Time Selector turned off. In short, I'm comparing the clicked date with another date to determine if that date is allowed or not, if not show an alert(). I do have an on submission validation that runs as well, but the client wants this alert.

For testing, I'm attempting to show the below onClick alert() when a date is clicked on within the JDate's calendar popup, with the Time Selector turned off, but the calendar's "close" is fired before my alert() method fires so the popup calendar closes before my below test alert() shows.

With having the "Show time selector" setting set to "Yes" keeps the calendar up that's not an issue and the alert shows, only when it is set to "No".

jQuery(function($) {
   $("body").delegate("td.day", "click", function() {
     alert("A date was clicked!");
   });
});

I've been trying with the code in different locations (form_x.js, top of the template's header, within the element JS, etc), searching Google for clues and coding techniques, but can't figure a way to get my alert to fire first when the Time Selector is turned off. Would anyone have an idea? Or at least if that it is not possible and I'll chalk it up as that.

Thanks!

 

[lousyfool]

There might be different, cleverer ways, however my first thought is to leave the time selector on but hide it with CSS...

 

[hominid4]

Thanks LF, I'm sorry, I did mean to add that hiding the time selector with CSS is what I did the first time around and that was fine in that case, but it adds the time to the input (even though I have 'Y-m-d' for the Form Format) and the input needs to show the format Y-m-d as it does with the time selector off. Thanks again.

 

[lousyfool]

Oh ok... didn't see that coming after not looking beyond my first thought, haha.
Well, since you're ok with just hiding things and you're not adverse to JS: https://www.codegrepper.com/code-examples/javascript/remove+time+from+date+in+jquery

 

[hominid4]

Good deal, I have other code that is running onClick based on the date that is selected, but in regards to removing the time from the _cal input field I threw in the below code and that'll suffice for now until I have more time to circle around to it.

Form ID: 1
Date Element: event_activity___activity_date
Date Element 'Show time element': Yes

Code within form_1.js:

requirejs(['fab/fabrik'], function() {

   jQuery('body').delegate('td.day', 'click', function () {

      // Get Form ID: 1 instance
      var form = Fabrik.getBlock('form_1');

      // Date element and selected date value variables
      var elDate = form.formElements.get('event_activity___activity_date');
      var selectedDateVal = elDate.getValue();
    
      // Get selected date only without time
      var dateWithoutTime = selectedDateVal.split(' ')[0];

      // Set date element's input with selected date without time variable
      jQuery('#event_activity___activity_date_cal').val(dateWithoutTime);

   });

});

Thanks again for the ideas.