New to Kendo UI for jQuery? Start a free 30-day trial

Shortcuts

configuration

An array of buttons that hold certain timeframe values and will be displayed in the popup

<input id="timedurationpicker" />
<script>
$("#timedurationpicker").kendoTimeDurationPicker({
    columns: [ "hours", "minutes" ],
    shortcuts: [
        { text: "1h 30min", value: 5400000 },
        { text: "2h", value: 7200000  }
    ]
});
</script>

The text that will be displayed in the button

<input id="timedurationpicker" />
<script>
$("#timedurationpicker").kendoTimeDurationPicker({
    columns: [ "hours", "minutes" ],
    shortcuts: [
        { text: "1h 30min", value: 5400000 },
        { text: "2h", value: 7200000  }
    ]
});
</script>

The value of the timeframe in milliseconds

<input id="timedurationpicker" />
<script>
$("#timedurationpicker").kendoTimeDurationPicker({
    columns: [ "hours", "minutes" ],
    shortcuts: [
        { text: "1h 30min", value: 5400000 },
        { text: "2h", value: 7200000  }
    ]
});
</script>