Search code examples
dojoxpages

Set the start time and end time of a Dojo time picker in XPages

I would like the Dojo time picker to only show the times between a start and end time. The code below will disable the invalid times but still shows it (the picker is too long!)

    <xp:inputText id="inputText2">


    <xp:this.attrs>
        <xp:attr
            name="data-dojo-props"
            value="constraints: { min:'T09:00:00', max:'T18:30:00', timePattern: 'HH:mm', clickableIncrement: 'T00:30:00',visibleIncrement: 'T01:00:00' }">
        </xp:attr>
    </xp:this.attrs>
    <xp:dateTimeHelper id="dateTimeHelper2"></xp:dateTimeHelper>
    <xp:this.converter>
        <xp:convertDateTime type="time"></xp:convertDateTime>
    </xp:this.converter>
</xp:inputText>

Any suggestions? Ideally after I get this going I want to set these values based on another time picker so the user will only see times after what was chosen in the first picker...

Solution

  • The disabled entries in the time picker get the style dijitTimePickerItemDisabled. You can hide them with css:

    .dijitTimePickerItemDisabled {display: none;}