1. #1
    Touch Premium Member
    Join Date
    Feb 2008
    Posts
    206
    Vote Rating
    0
    BlueCamel is on a distinguished road

      0  

    Default Force the number keypad on iPhone

    Force the number keypad on iPhone


    This likely would be better as a plugin to Ext.form.Field to start accepting a pattern: option. However, quick and dirty, here is an alternative Number field that will force the numeric keypad on iPhone

    Code:
    Ext.form.Zip = Ext.extend(Ext.form.Text, {
        ui: 'number',
        inputType: 'text',
        minValue : undefined,
        maxValue : undefined,
        stepValue : undefined,
        renderTpl: [
            '<tpl if="label"><div class="x-form-label"><span>{label}</span></div></tpl>',
            '<tpl if="fieldEl"><div class="x-form-field-container">',
                '<input id="{inputId}" type="{inputType}" name="{name}" pattern="[0-9]*" class="{fieldCls}"',
                    '<tpl if="tabIndex">tabIndex="{tabIndex}" </tpl>',
                    '<tpl if="placeHolder">placeholder="{placeHolder}" </tpl>',
                    '<tpl if="style">style="{style}" </tpl>',
                    '<tpl if="minValue != undefined">min="{minValue}" </tpl>',
                    '<tpl if="maxValue != undefined">max="{maxValue}" </tpl>',
                    '<tpl if="stepValue != undefined">step="{stepValue}" </tpl>',
                    '<tpl if="autoComplete">autocomplete="{autoComplete}" </tpl>',
                    '<tpl if="autoCapitalize">autocapitalize="{autoCapitalize}" </tpl>',
                    '<tpl if="autoFocus">autofocus="{autoFocus}" </tpl>',
                '/>',
                '<tpl if="useMask"><div class="x-field-mask"></div></tpl>',
                '</div></tpl>',
            '<tpl if="useClearIcon"><div class="x-field-clear-container"><div class="x-field-clear x-hidden-visibility">&#215;</div><div></tpl>'
        ],
        // @private
        onRender : function() {
            Ext.apply(this.renderData, {
                maxValue : this.maxValue,
                minValue : this.minValue,
                stepValue : this.stepValue 
            });
            
            Ext.form.Zip.superclass.onRender.apply(this, arguments);
        }
    });
    Ext.reg('zipfield', Ext.form.Zip);

  2. #2
    Sencha User
    Join Date
    Aug 2011
    Posts
    12
    Vote Rating
    0
    RunPixelRun is on a distinguished road

      0  

    Default


    Thanks. Very handy. This should be a default component.

  3. #3
    Sencha User
    Join Date
    Sep 2011
    Location
    Vicenza, Veneto, Italy
    Posts
    18
    Vote Rating
    0
    MPeg is on a distinguished road

      0  

    Default


    ok, nice workaround.

    what pattern do i need to use to show numeric keypad with comma or dot to allow my user insert a float number?

    Thanks.
    Follow my blog at: MovableApp.com!
    http://twitter.com/#!/movableapp - My Sencha Touch Learning Experience

  4. #4
    Sencha User
    Join Date
    Jul 2011
    Location
    Utrecht
    Posts
    84
    Vote Rating
    3
    DJFliX is on a distinguished road

      0  

    Default


    Hi! I know this is not ST2.0 but have you considered making a version for ST2.0? I'm currently trying to get similar functionality on ST2.0 but I seem to fail.

  5. #5
    Sencha User
    Join Date
    Mar 2012
    Posts
    3
    Vote Rating
    0
    frAydjwe is on a distinguished road

      0  

    Default


    Have you got an issue for Android ?

  6. #6
    Sencha User
    Join Date
    Jul 2011
    Location
    Holland
    Posts
    97
    Vote Rating
    0
    mrduck is an unknown quantity at this point

      0  

    Default


    In Sencha Touch 2 you can load the following code to achieve the same behavior.

    Code:
    Ext.define('Ext.field.Number', {    extend: 'Ext.field.Text',
        xtype: 'textnumberfield',
    
    
        config: {
            component: {
    			pattern : '[0-9]*'
            },
            ui: 'number'
        },
    });

  7. #7

  8. #8

Similar Threads

  1. [2.0.1] IE keypad char code handling on keypress
    By FxMan in forum Ext 2.x: Help & Discussion
    Replies: 3
    Last Post: 16 Jul 2013, 12:17 AM
  2. Testing iPhone app wihout iphone (or simulator): Chrome user agent spoofing?
    By charris in forum Sencha Touch 1.x: Discussion
    Replies: 10
    Last Post: 9 Jan 2012, 12:24 PM
  3. Ext.js拡張 ソフトウェアキーボード、KeyPad
    By yuki in forum Japanese Sencha Forum
    Replies: 2
    Last Post: 16 Aug 2010, 6:04 PM
  4. DEL Key on numeric Keypad.
    By BuckBazooka in forum Ext Designer: Help & Discussion
    Replies: 2
    Last Post: 14 Apr 2010, 11:47 PM
  5. [FIXED] NumberField & numeric keypad
    By yopiyop in forum Ext GWT: Bugs (1.x)
    Replies: 1
    Last Post: 22 Jul 2008, 8:28 AM

Thread Participants: 7

Turkiyenin en sevilen filmlerinin yer aldigi xnxx internet sitemiz olan ve porn sex tarzi bir site olan mobil porno izle sitemiz gercekten dillere destan bir durumda herkesin sevdigi bir site olarak tarihe gececege benziyor. Sitenin en belirgin ozelliklerinden birisi de Turkiyede gercekten kaliteli ve muntazam, duzenli porno izle siteleri olmamasidir. Bu yuzden iste. Ayrica en net goruntu kalitesine sahip adresinde yayinlanmaktadir. Mesela diğer sitelerimizden bahsedecek olursak, en iyi hd porno video arşivine sahip bir siteyiz. "The Best anal porn videos and slut anus, big asses movies set..." hd porno faketaxi