Results 1 to 3 of 3

Thread: Selectfield style in iPhone

  1. #1
    Sencha User
    Join Date
    Jul 2011
    Posts
    26
    Vote Rating
    0
      0  

    Default Selectfield style in iPhone

    iOS always layouts selectfield like A. How can I force it to show as B?
    I have gone nuts through the css file but didn't make it

    00000001.jpg

    Any help appreciated...

  2. #2
    Sencha User tomalex0's Avatar
    Join Date
    Apr 2009
    Location
    San Jose, CA
    Posts
    589
    Vote Rating
    20
      0  

    Default

    Picker and List for selectfield are shown based on the device you are using. For iphone it will be the picker and for ipad and browsers it will the list.

    If you want to use List for all conditions you have to extend current selectfield or override.

    Below override or extend should work for you. But im not sure how it will work with iphone devices.
    Try it and let me know if this works in device.
    Code:
    Ext.override(Ext.form.Select, {
                    // @private
                    showComponent: function() {
                        var listPanel = this.getListPanel(),
                        index = this.store.findExact(this.valueField, this.value);
            
                        listPanel.showBy(this.el, 'fade', false);
                        listPanel.down('#list').getSelectionModel().select(index != -1 ? index: 0, false, true);
                    }
                });

    Code:
    Ext.form.ListSelect = Ext.extend(Ext.form.Select,  {
                    // @private
                    showComponent: function() {
                        var listPanel = this.getListPanel(),
                        index = this.store.findExact(this.valueField, this.value);
            
                        listPanel.showBy(this.el, 'fade', false);
                        listPanel.down('#list').getSelectionModel().select(index != -1 ? index: 0, false, true);
                    }
                });
                Ext.reg('listselectfield', Ext.form.ListSelect);

  3. #3
    Sencha User
    Join Date
    Jul 2011
    Posts
    26
    Vote Rating
    0
      0  

    Default

    Works great!
    Just a couple of issues (which is not your code, it is general for selectfield) when label has two or more lines: (1) it is not centered vertically and (2) there is a black box below the dropdown (which is closed):

    00000001.png

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •