Extjs: (TimeField) reset minValue and maxValue

10.6k Views Asked by At

I have an ExtJS TimeField where I use the setMinValue(...) and setMaxValue(...) to only show the valid time-elements to the user. This works just fine, but how do I reset the minValue and maxValue so that the user can see all the time-elements again?

I don't want to clear the field, just show all the elements from the store again.

4

There are 4 best solutions below

4
On BEST ANSWER

I don't see any "clean" way to accomplish this, but I do have a temporary workaround until you find something more suitable.

Try setting the TimeField's minValue and maxValue to undefined or null, and then call generateStore() on your TimeField:

    // private
    generateStore: function(initial){
        var min = this.minValue || new Date(this.initDate).clearTime(),
            max = this.maxValue || new Date(this.initDate).clearTime().add('mi', 
                        (24 * 60) - 1),
            times = [];

        while(min <= max){
            times.push(min.dateFormat(this.format));
            min = min.add('mi', this.increment);
        }
        this.bindStore(times, initial);
    },

Yes it is a private method, so normally you shouldn't use it, but the method would normally be called if you simply reset minValue or maxValue, so you're just skipping a step. By setting both properties to null, the declaration for var min, max = will be equal to the default. You can't go about this by calling setMinValue() or setMaxValue() because it uses a private method that attempts to parse a Date out of the value you pass to the methods (it will fail at parsing null):

    // private
    setLimit: function(value, isMin, initial){
        var d;
        // will fail here
        if(Ext.isString(value)){
            d = this.parseDate(value);
        // will fail as well
        }else if(Ext.isDate(value)){
            d = value;
        }
        // will never make it here, because 'd' wasn't set above
        if(d){
            var val = new Date(this.initDate).clearTime();
            val.setHours(d.getHours(), d.getMinutes(), d.getSeconds(),
                         d.getMilliseconds());
            this[isMin ? 'minValue' : 'maxValue'] = val;
            if(!initial){
                this.generateStore();
            }
        }
    }

Update:

A cleaner approach would be to extend TimeField and add a resetMinAndMax method that accomplishes the above (set minValue/maxValue to null, call to generate store), or add the method in an override. That way you can avoid making calls to the "private" generateStore() everywhere.

0
On

you can use simply

this.setMinValue(false);

good luck

0
On

Are you after the initial values for the timefield when the page is loaded? If that's the case, you should be able to use the reset() method of the FIELD class. You should have access to this since the timefield component is extended from FIELD.

0
On

The extjs only reset the property "value" from a component(if i'm not wrong), well, i don't know if my code is the better way, but..like the above answer, i overrode the reset method from DateField class using the code of Field class and add a 2 more properties to keep the original values(originalMinValue and originalMaxValue).

the originalMinValue and originalMaxValue are started onRender event of my Date Field.

this.setValue = this.setValue.createSequence(this.updateHidden);
this.originalMinValue = this.minValue;
this.originalMaxValue = this.maxValue;
// this is part of me onRender event code

and that's the override

Ext.override(Ext.form.DateField,{   
originalMinValue : null,
originalMaxValue : null,
reset : function() {                
    this.setValue(this.originalValue);      
    this.setMinValue(this.originalMinValue);
    this.setMaxValue(this.originalMaxValue);
    this.clearInvalid();        
}

})

this way, we can use the component's reset method e then, value, minValue, and MaxValue going back to the originalValue.

sorry for my bad english.