How to position a webshims datetime-local's popup using js?

Question

I have an input positioned on the right of the screen. If the window is too little, part of the datepicker is outside of the screen. My webshims configuration is as follow:

$.webshims.setOptions('forms-ext', {
    replaceUI: false,
    types: 'datetime-local month date time number',
    date: {
        popover: {
            position: {
                my: 'center',
                at: "center"
            }
        }
    }
});

It works with a date input but not with a datetime-local one.

I can't modify the HTML, how can I position the popup so it is always visible ?

Answer 1

In case you want to modify the popover for the datetime-local use the options key datetime-local instead of date:

webshims.setOptions('forms-ext', {
    types: 'datetime-local month date time number',
    'datetime-local': {
        popover: {
            position: {
                my: 'center',
                at: 'center',
                collision: 'fit'
            }
        }
    }
});

In case you want to modify the popovers for all you input widgets (datetime-local, date and month) use the widgets config:

webshims.setOptions('forms-ext', {
    types: 'datetime-local month date time number',
    widgets: {
        popover: {
            position: {
                my: 'center',
                at: 'center',
                collision: 'fit'
            }
        }
    }
});