设置 Zend Dojo TextTimeBox 的时间范围

Question

您好，可以将 Dojo textTimeBox 的时间范围设置为 09:00 - 18:30。

我在 Zend 或 Dojo 文档中都找不到任何内容来说明如何做到这一点或是否可以做到。

非常感谢。

Answer 1

您可以为小部件设置最大和最小约束：

new dijit.form.TimeTextBox({
    name: "prog_val",
    value: new Date(),
    constraints: {
        timePattern: 'HH:mm:ss',
        clickableIncrement: 'T00:15:00',
        visibleIncrement: 'T00:15:00',
        visibleRange: 'T01:00:00',
        min:'T09:00:00',
        max:'T18:30:00'
    }
    },
    "prog_val");

它不允许用户输入超出允许值的数据。 但是，这仍然允许用户滚动到禁用时间，用户只是无法选择它们。

为了隐藏禁用时间，你应该做一些 hack :)

您应该覆盖dijit._TimePicker 的_getFilteredNodes 方法。例如：

dojo.declare("my._TimePicker", dijit._TimePicker, {
                // extend the default show() method
                _getFilteredNodes: function (/*number*/start, /*number*/maxNum, /*Boolean*/before) {
                    // summary:
                    //      Returns an array of nodes with the filter applied.  At most maxNum nodes
                    //      will be returned - but fewer may be returned as well.  If the
                    //      before parameter is set to true, then it will return the elements
                    //      before the given index
                    // tags:
                    //      private
                    var nodes = [], n, i = start, max = this._maxIncrement + Math.abs(i),
                chk = before ? -1 : 1, dec = before ? 1 : 0, inc = before ? 0 : 1;
                    do {
                        i = i - dec;
                        var date = new Date(this._refDate);
                        var incrementDate = this._clickableIncrementDate;
                        date.setHours(date.getHours() + incrementDate.getHours() * i,
                    date.getMinutes() + incrementDate.getMinutes() * i,
                    date.getSeconds() + incrementDate.getSeconds() * i);
                        if (!this.isDisabledDate(date)) {
                            n = this._createOption(i);
                            if (n) { nodes.push(n); }
                        }
                        i = i + inc;
                    } while (nodes.length < maxNum && (i * chk) < max);
                    if (before) { nodes.reverse(); }
                    return nodes;
                }

            });

您需要将这个新类 ('my._TimePicker') 设置为文本时间框的 popupClass 属性：

dojo.addOnLoad(function () { dijit.byId("prog_val").popupClass = "my._TimePicker"; });

你可以看到：it works!