2013-05-13 55 views
0

我在Sencha touch 2.1中創建了一個選擇器。我的數據正常顯示。我想禁用一個特殊的值不全是這樣,如果我選擇該值並點擊「10 doneButton」,那麼它不應該被採用。如何在Sencha touch中禁用Picker中的特定行

例子:

function loadPicker(paramName, valueSet) { 
    Ext.Viewport.remove(Ext.getCmp(paramName + 'Pickerfield'), true); 
    if (!paramName.picker) { 
     paramName.picker = Ext.Viewport.add({ 
      xtype: 'picker', 
      id: paramName + 'Pickerfield', 
      useTitles: true, 
      slots: [{ 
       name: paramName, 
       title: paramName, 
       data: valueSet 
      }], 

      doneButton: { 
       listeners: { 
        tap: function(button, event, eOpts) { 
         var selectedPacingModeValue = 
          Ext.getCmp(paramName + 'Pickerfield').getValue()[paramName]; 
         sendSetPendingRequest(paramName, selectedPacingModeValue); 
        } 
       } 
      } 
     }); 
    } 
} 

讓我們這些都是我選擇器字段中的值。我正在做的選擇一個值,然後點擊「doneButton」,我在文本框中顯示值。我要的是,如果我將選擇「選項2」,然後單擊「doneButton」然後選項2不應顯示在文本字段但對於所有其他值這個選擇,並顯示在文本框的操作應該工作。

+0

它不是真正清楚你...有選擇字段,文本字段和廣告一個按鈕?你想要在文本框中顯示一些選項(沒有禁用標誌),有些不顯示在文本框中(帶有禁用標誌)?你不能只是得到選定的記錄,並點擊完成按鈕時檢查該標誌,然後移動到文本框(或不)? – VDP 2013-05-13 07:41:12

+0

我有一個文本框和一個完成按鈕的選擇器。是的這正是我想要按照殘疾人標誌所做的事情。 – Fabre 2013-05-13 07:42:36

+0

我會制定一個答案的例子;) – VDP 2013-05-13 07:44:01

回答

1

您只需點擊完成按鈕即可獲取所選記錄並檢查該標記,然後移至文本框(或不)。

Ext.create('Ext.form.Panel', { 
    fullscreen: true, 
    items: [ 
     { 
      xtype: 'fieldset', 
      title: 'Select', 
      items: [ 
       { 
        xtype: 'selectfield', 
        itemId: 'mySelectField', 
        label: 'Choose one', 
        options: [ 
         { 
          text: 'apple', 
          value: 50 
         }, { 
          text: 'orange', 
          value: 100, 
          disabled: true 
         }, { 
          text: 'banana', 
          value: 200 
         }, { 
          text: 'papaya', 
          value: 300 
         } 
        ] 
       }, 
       { 
        xtype: 'button', 
        text: 'done', 
        handler: function(button){ 
         var panel = button.up(), 
          sf = panel.down('#mySelectField'), 
          tf = panel.down('#answerfield'); 

         /* you can only access the raw value unless you use 
         * an actual store and an actual model with the 
         * disabled field. In that case you can do 
         * sf.getRecord().get('disabled') 
         */ 
         if(sf.getRecord().raw.disabled === true){ 
          tf.setValue(''); //noting to see :) 
         } else { 
          tf.setValue(sf.getRecord().get('text')); //display value 
         } 
        } 
       }, 
       { 
        xtype: 'textfield', 
        itemId: 'answerfield', 
        title: 'answer' 
       } 
      ] 
     } 
    ] 
}); 

工作小提琴:http://www.senchafiddle.com/#d46XZ

UPDATE 就像你問:與選擇器

Ext.Loader.setConfig({ 
    enabled: true 
}); 

Ext.application({ 
    name: 'SenchaFiddle', 

    launch: function() { 
     var picker = Ext.create('Ext.Picker', { 
      slots: [ 
       { 
        name : 'stuff', 
        title: 'Stuff', 
        data : [ 
         { 
          text: 'apple', 
          value: 50 
         }, { 
          text: 'orange', 
          value: 100, 
          disabled: true 
         }, { 
          text: 'banana', 
          value: 200 
         }, { 
          text: 'papaya', 
          value: 300 
         } 
        ] 
       } 
      ], 
      listeners: { 
       change: function(p, value){ 
        var tf = panel.down('#answerfield'), 
         firstSlot = p.getItems().get(1), //index 0 is the toolbar 1 first slot and so on.. 
         selectedRecord = firstSlot.getData()[firstSlot.selectedIndex]; 
        if(selectedRecord.disabled === true){ 
         tf.setValue(''); //noting to see :) 
        } else { 
         console.log(selectedRecord); 
         tf.setValue(selectedRecord.text); //display value 
        } 
       } 
      } 
     }); 
     var panel = Ext.create('Ext.form.Panel', { 
      fullscreen: true, 
      items: [ 
       { 
        xtype: 'fieldset', 
        title: 'Select', 
        items: [ 
         { 
          xtype: 'button', 
          text: 'show picker', 
          handler: function(button){ 
           Ext.Viewport.add(picker); 
           picker.show(); 
          } 
         }, 
         { 
          xtype: 'textfield', 
          itemId: 'answerfield', 
          title: 'answer' 
         } 
        ] 
       } 
      ] 
     }); 


    } 
}); 

工作小提琴:http://www.senchafiddle.com/#SFgpV

+0

這真是一個很好的例子VDP。但我的代碼有點不同。我正在動態獲取我的值,而且我沒有使用selectfield ...我已經編輯了上面的示例中的工作代碼... plz查看它 – Fabre 2013-05-13 09:46:41