Single Datepicker to show month and year only

I’m assuming you’re using a Custom Field Renderer to apply this to just a particular Date field? If so, just add a class, e.g. “hide-datepicker-calendar” to the specific element from within your Custom Field Renderer, e.g.

myElement.addClass(‘hide-datepicker-calendar’).datepicker({
     changeMonth: true,
     changeYear: true,
     showButtonPanel: true,
     dateFormat: ‘MM yy’,
     onClose: function(dateText, inst) { 
         var month = $(“#ui-datepicker-div .ui-datepicker-month :selected”).val();
         var year = $(“#ui-datepicker-div .ui-datepicker-year :selected”).val();
         $(this).datepicker(‘setDate’, new Date(year, month, 1));
     }
});

and then change your CSS to be more selective, like this:

.hide-datepicker-calendar .ui.datepicker.calendar {
   display: none;
}

That would be perfect, except the html for the calendar ‘popup’ is separate from the input element of the field. It seems to be after the page footer…

Here’s the input element with the added class

here’s the element for the calendar itself

Ah that’s true. Hmm. This is tricky.

If anyone can figure it, it’s you!

Any brilliant brainstorms over the weekend, fellow skuidites?