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
    95
    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

film izle

hd film izle

film sitesi

takipci kazanma sitesi

takipci kazanma sitesi

güzel olan herşey

takipci alma sitesi

komik eğlenceli videolar