0

我有一个选择字段并希望手动处理选择字段选择器事件。以下代码为 selectfield :

{
          xtype: 'selectfield',  
          label: 'Choose one',  
          name:'abcd',  
          usePicker:true,  
          options: [  
              {text: 'First Option',  value: 'first'},  
              {text: 'Second Option', value: 'second'},  
              {text: 'Third Option',  value: 'third'}     

    ],     
    defaultPhonePickerConfig: {  
        hideOnMaskTap: true,  
        listeners: {  
            change: function(ths, val) {
               console.log('change event called');
            },
            pick: function(ths, The, slot) {
              console.log('pick event called');
                PICKER_CONFIG = null;
                if (PICKER_CONFIG != true) {
                    if (The[slot.getName()] != undefined && The[slot.getName()] != null && The[slot.getName()] != "") {
                     //   Ext.getCmp('contractList').setValue(The[slot.getName()]);
                        ths.fireEvent('change', ths, The);
                        ths.hide();
                    }
                }
            },
            cancel: function() {
                console.log('cancel called');
                PICKER_CONFIG = true;
            },
            show:function(){
              console.log('show called');  
            }
        }
    },

pick没有被调用,因为我使用的是 base css。

这是我的 app.scss

@import 'sencha-touch/base';

但如果我使用sencha-touch default 和 default/all css,它的工作原理如下:

@import 'sencha-touch/default';
@import 'sencha-touch/default/all;

但是,我不想使用它
有没有办法通过使用sencha-touch/base css来获得选择

4

2 回答 2

0

这是我在 SelectField 中设置 Picker 时写的:

  {
                        xtype: 'selectfield',
                        usePicker: true,
                        displayField: 'text',
                        valueField: 'value',
                        options: [
                            { text: 'Choose Dosage', value: 'default' },
                        ],
                        defaultPhonePickerConfig : {
                            listeners: {
                                change: function(thePicker, newValue, oldValue) {
                                    //check if custom variable has been set to false
                                    if (newValue.slotsNumeric != null && newValue.slotsDecimal != null) {
                                        var total = newValue.slotsNumeric + newValue.slotsDecimal;
                                        // set the select field to show the correct selected value!!
                                        var DecimalPicker = Ext.ComponentQuery.query('selectfield')[0];
                                        DecimalPicker.setOptions({
                                            text: total,
                                            value: total
                                        });
                                    }
                                },
                            },
                            useTitles: true,
                            hideOnMaskTap: true,
                            slots: [
                                {
                                    name  : 'slotsNumeric',
                                    title : 'Numeric',
                                    align: 'center',
                                    data : [
                                        {text: '0', value: 0},
                                        {text: '1', value: 1},
                                        {text: '2', value: 2},
                                        {text: '3', value: 3},
                                        {text: '4', value: 4},
                                        {text: '5', value: 5},
                                        {text: '6', value: 6},
                                        {text: '7', value: 7},
                                        {text: '8', value: 8},
                                        {text: '9', value: 9},
                                    ]
                                }, 
                                {
                                    name  : 'slotsDecimal',
                                    title : 'Decimal',
                                    align: 'center',
                                    data : [
                                        {text: '.0', value: .0},
                                        {text: '.1', value: .1},
                                        {text: '.2', value: .2},
                                        {text: '.3', value: .3},
                                        {text: '.4', value: .4},
                                        {text: '.5', value: .5},
                                        {text: '.6', value: .6},
                                        {text: '.7', value: .7},
                                        {text: '.8', value: .8},
                                        {text: '.9', value: .9},
                                    ]
                                }
                            ]
                        }                   
                    }
于 2015-02-12T10:48:39.223 回答
0

唔...

你能告诉我你从哪里得到“挑选”事件吗?它应该做什么?

我猜它和“改变”做同样的事情。

你怎么知道它,因为你使用的是基础 css ?从我读到的基本 css 中,sencha 将使用最少的样式来使组件工作,其余的将取决于用户。所以应该对事件组件的行为没有影响。

于 2014-04-15T15:43:57.853 回答