dxDateBox - How to set min and max time

Hi,

I am using following code

markup
 <div dx-date-box="secondTimeFormat"></div>

angular script
  $scope.secondTimeFormat = {
        type: "time",
        placeholder: "Second Choice Time",
        bindingOptions: {
            value: 'secondTimeFormatValue'
        },
        interval: 15,
        value: new Date(2016, 11, 14),
        min: new Date(2016, 11, 14, 8),
        max: new Date(2016, 11, 14, 20)
    }

but it is still showing up the time all the times only

Here is with dateTime

it is still not working , it is showing all times in box

$scope.firstDateTimeFormat = {
        type: "datetime",
        min: minDate,
        dateOutOfRangeMessage: "Select future date only.",
        placeholder: "First Choice Date",
        bindingOptions: {
            value: 'firstDateFormatValue'
        },
        onOpened: function (e) {
            e.component._strategy._timeView._hourBox.option('min', 8);
            e.component._strategy._timeView._hourBox.option('max', 20);
        }
    }

Hi,

I checked the provided code and noticed that the value option is defined incorrectly in the first code snippet. In addition, make sure that the secondTimeFormatValue and firstDateFormatValue variables are defined in the Controller. I've created a simple example illustrating these suggestions - https://jsfiddle.net/ArtemK/L6rb7chc/1/
If it doesn't help, please modify it to illustrate the issue in action and post the updated link here for further research.

Hi,

Here is the problem , my requirement is not to load default value when page is loaded, That is not why I am not initializing it.

so by giving example I am assuming that I have to initialize the value to make it work. is that correct?

I have modified the sample you provided ,https://jsfiddle.net/7u15mbpL/

Please let me know what you think

Thanks,
Paritosh

Hi,

Thanks for the clarification. You can set these variables to nulls - https://jsfiddle.net/ArtemK/7u15mbpL/1/.
I also noticed that the value option cannot be undefined in this scenario, and created a separate ticket on your behalf regarding this issue:
dxDateBox - The min and max settings don't work if the value option is undefined
Our R&D team will research it in greater detail.

Hi,

Please ignore my last comment(I have deleted it though).  in jsfiddle you gave me If I am trying to change Timepicker couple of times , It just throws the validation error (Invalid date).

https://jsfiddle.net/1o0apx0b/

Please let me know if you cannot see it.

Thanks,
Paritosh

Added the picture

Paritosh,

I suggest that you specify the current month when you create a Date object. The https://jsfiddle.net/1o0apx0b/2/ example shows how to accomplish this task.

Hi,

Thanks for reply.

Can you help to understand what is happening if I try to reset the values? I have put a reset button and reset button set null value in secondTimeFormatValue and I am starting to get validation errors

Attached is snap shot of the same.