एक बता गया कि मूल्य

Question

मैं एक combobox है ऑटो को सही जिसमें एक एक निश्चित समय अवधि चुन सकते हैं, उदाहरण के लिए:

5 minutes 
15 minutes 
1 hour 
2 hours 
1 day 
2 days 
1 week 
2 weeks 

यह हमेशा सर्वर से मिनट की संख्या है, लेकिन उपयोगकर्ता wouldn 'पहुंचाता समझ में नहीं आता कि "10080" का अर्थ है (गणना करने का प्रयास करने से पहले: यह एक सप्ताह है)।

एक नई आवश्यकता यह है कि उपयोगकर्ता उस बॉक्स में मनमाना मूल्य टाइप करने में सक्षम होना चाहिए। जैसे "20 मिनट", "1 घंटा 5 मिनट", "2h 5m" या "1 डी 6h 120 मीटर"; और, यदि फ़ील्ड को एक निश्चित मान (उदाहरण के लिए 75) पर प्रोग्रामेटिक रूप से सेट किया गया है, तो फ़ील्ड को सही स्ट्रिंग (1 घंटा 15 मिनट)

दिखाया जाना चाहिए, इसलिए मैंने एक पार्सर और फॉर्मेटर फ़ंक्शन लिखा है (नीचे देखें) लेकिन मैं इन का उपयोग करने के लिए अपने combobox कैसे प्राप्त कर सकते हैं?

rawToValue:function(rawValue) { 
    console.log('rawToValue'); 
    console.log(rawValue); 
    return this.parse(rawValue) || rawValue || null; 
}, 
valueToRaw:function(value) { 
    console.log('valueToRaw'); 
    console.log(value); 
    return this.format(value); 
}, 

लेकिन वे कहा जाता है नहीं कर रहे हैं, मैं किसी भी सांत्वना लॉग उत्पादन नहीं मिलता:

मैं पहले से ही rawToValue/valueToRaw समारोह जोड़ी, मैं क्या datefield कोड में पाया के समान अधिभावी की कोशिश की।

ये पार्सर/फ़ॉर्मेटर कार्य हैं:

Ext.define('AlarmTimeField',{ 
    extend:'Ext.form.field.ComboBox', 
    format:function(minutes) { 
     var a = []; 
     Ext.each(this.units, function(unit) { 
      if(minutes >= unit.minutes) { 
       var unitCount = Math.floor(minutes/unit.minutes); 
       console.log(unitCount); 
       minutes = minutes-unitCount*unit.minutes; 
       a.push("" + unitCount + " " + (unitCount==1?unit.singular:unit.plural)); 
      } 
     }); 
     return a.join(' '); 
    }, 
    parse:function(input) { 
     if(!input) return 0; 
     var me=this, 
      inputSplit = input.split(' '), 
      value = 0, 
      lastNum = 0; 
     Ext.each(inputSplit,function(input) { 
      if(!input) return; 
      else if(Ext.isNumeric(input)) lastNum = input; 
      else if(Ext.isNumeric(input[0])) { 
       var inputUnit = input.slice(-1), 
        inputValue = input.slice(0,-1); 
       Ext.each(me.units,function(unit) { 
        if(inputUnit==unit.abbr) { 
         value+=unit.minutes*inputValue; 
        } 
       }); 
      } 
      else { 
       Ext.each(me.units,function(unit) { 
        if(input==unit.singular || input==unit.plural || input==unit.abbr) { 
         value+=unit.minutes*lastNum; 
        } 
       }); 
      } 
     }); 
     return value; 
    }, 
    units:[{ 
     minutes:10080, 
     abbr:'w', 
     singular:'week', 
     plural:'weeks' 
    },{ 
     minutes:1440, 
     abbr:'d', 
     singular:'day', 
     plural:'days' 
    },{ 
     minutes:60, 
     abbr:'h', 
     singular:'hour', 
     plural:'hours' 
    },{ 
     minutes:1, 
     abbr:'m', 
     singular:'minute', 
     plural:'minutes' 
    }] 
}); 

Answer 1

मुख्य विचार यह है कि Ext.form.field.ComboBox मूल्य वास्तव में, Ext.data.Model का उदाहरण है तो अपने मूल्य और मूल्य केवल मॉडल का श्रेय जाता है मान प्रदर्शित और हर बार जब आप मान बदलने/प्रदर्शित मूल्य आपको बाध्य मॉडल उदाहरण अपडेट करना होगा (यह मेरी दृष्टि है, अगर मैं गलत हूं तो मुझे सही करें)।

मुझे लगता है कि Ext.form.field.ComboBox.validator अच्छी जगह मैन्युअल inputted मूल्यों पार्स करने के लिए है (और आप तुरंत त्रुटि संदेश प्रदर्शित कर सकते हैं अगर inputted मूल्य सही नहीं है), तो आप इसे इस तरह ओवरराइड कर सकते हैं:

   validator: function (value) { 
        // TODO: Add regexp value format validator 

        var minutes = me.parse(value); 
        // Add check for zero/empty values if needed 
        if (minutes === 0) 
        // Add meaningful error message 
         return 'Incorrect input'; 
        else { 
         me.setValue(Ext.create('Ext.data.Model', { 
          value: minutes, 
          text: value 
         })); 
         return true; 
        } 
       } 

इसकी काफी कच्चा उदाहरण, लेकिन मुझे लगता है कि विचार स्पष्ट है।

 setValue: function (value) { 
      // TODO: Add array of values support 
      if (Ext.isNumber(value)) 
       value = Ext.create('Ext.data.Model', { 
        value: value, 
        text: this.format(value) 
       }); 

      this.callParent([value]); 
     } 

चेक इस fork of your fiddle:

प्रारूप मूल्यों के लिए setValue() विधि आप इस तरह, इस विधि ओवरराइड कर सकते हैं के माध्यम से प्रोग्राम के setted। मुझे उम्मीद है कि मैंने थोड़ा सा मदद की है।