Success! Looks like we've fixed this one. According to our records the fix was applied for TOUCH-1210 in a recent build.
  1. #1
    Sencha User
    Join Date
    Oct 2011
    Posts
    127
    Vote Rating
    0
    robl is on a distinguished road

      0  

    Exclamation searchfield not showing "Search" button on iOS keyboard. Bug?

    searchfield not showing "Search" button on iOS keyboard. Bug?


    I have a FormPanel with a searchfield but it doesn't display a "Search" button on the iOS keyboard. Bug?

    Code:
    Ext.application({
        name: 'Sencha',
    
    
        launch: function() {
            Ext.create("Ext.Panel", {
                fullscreen: true,
                layout: 'fit',
                items: [
    				{
    					xtype: 'panel',
    					layout: 'fit',
    		            
    					items: [
    						{
    							xtype: 'toolbar',
    							docked: 'top',
    							title: 'test'
    						},
    						{
    							xtype: 'formpanel',
    							items: [
    					        {
    					            xtype: 'searchfield',
    					            name : 'name',
    					            label: 'Name'
    					        },
    					        {
    					            xtype: 'searchfield',
    					            name : 'email',
    					            label: 'Email'
    					        }
    			]
    						}
    					]
    				}
                ]
            });
        }
    });

  2. #2
    Sencha User
    Join Date
    Oct 2011
    Posts
    127
    Vote Rating
    0
    robl is on a distinguished road

      0  

    Default


    FYI - iOS will display the "Search" button if the input type = "search". I can't get this to work using the Sencha Touch 2.x searchfield.

    Source:
    http://developer.apple.com/library/s...nputTypes.html

  3. #3
    Sencha User
    Join Date
    Oct 2011
    Posts
    127
    Vote Rating
    0
    robl is on a distinguished road

      0  

    Default


    The strange thing is if I create a plain HTML file (using ST CSS but NOT loading ST javascript) using the input element that ST 2 created, it seems to work. i.e. The "Search" button is displayed.

    Code:
    <!DOCTYPE html>
    <html>
    <head>
    	<link href="../../resources/css/sencha-touch.css" rel="stylesheet" type="text/css" />
    </head>
    <body>
    	<form>
    		<input id="ext-element-19" class="x-input-el x-form-field x-input-search" type="search" name="name"/>
    	</form>
    </body>
    </html>

  4. #4
    Sencha User
    Join Date
    Oct 2011
    Posts
    127
    Vote Rating
    0
    robl is on a distinguished road

      0  

    Exclamation


    Another observation:

    The KitchenSink example in 2.0 (User Inteface->Forms->Toolbars) also fails to display the "Search" button. HOWEVER, the KitchenSink demo on sencha.com (ostensibly using ST 1.x) does display it. I think this is a regression bug.

  5. #5
    Sencha User
    Join Date
    Oct 2011
    Posts
    127
    Vote Rating
    0
    robl is on a distinguished road

      0  

    Default


    Below is a simpler example of the problem. Assuming that the problem is not in my code, is there a small hack/fix that I can make to the sencha-touch-all-debug.js script to fix this?

    Code:
    Ext.application({
        name: 'Search Field Problem',
    
    
        launch: function() {
            Ext.create("Ext.form.Panel", {
                fullscreen: true,
                layout: 'vbox',
                items: [
                {
                    xtype: 'searchfield',
                    name: 'name',
                    label: 'Name'
                },
                {
                    xtype: 'searchfield',
                    name: 'email',
                    label: 'Email'
                }
                ]
            });
        }
    });

  6. #6
    Sencha User
    Join Date
    Oct 2011
    Posts
    127
    Vote Rating
    0
    robl is on a distinguished road

      0  

    Post


    Sencha Touch 2.0.0-PR1 Kitchen Sink
    SearchFieldKitchenSink2.jpg

    Sencha Touch Kitchen Sink 1.1.0

    SearchFieldKitchenSink1.jpg

  7. #7
    Sencha User
    Join Date
    Nov 2011
    Posts
    20
    Vote Rating
    0
    John2011 is on a distinguished road

      0  

    Default


    I have run into the same issue. After inspecting the DOM I see that the element is set as <input type="search"> so I don't understand why the search button does not appear.

  8. #8
    Sencha User
    Join Date
    Oct 2011
    Posts
    127
    Vote Rating
    0
    robl is on a distinguished road

      0  

    Default


    Can someone from Sencha please respond and file a bug (or move this to the bug forum) for this?

  9. #9
    Sencha - Sencha Touch Dev Team rdougan's Avatar
    Join Date
    Oct 2008
    Posts
    1,158
    Vote Rating
    6
    rdougan will become famous soon enough

      0  

    Default


    Thanks for the report.
    Sencha Inc.
    Robert Dougan - @rdougan
    Sencha Touch 2 and Ext JS 4 Core Team Member, SASS/Theming Wizard.

  10. #10
    Sencha - Sencha Touch Dev Team rdougan's Avatar
    Join Date
    Oct 2008
    Posts
    1,158
    Vote Rating
    6
    rdougan will become famous soon enough

      0  

    Default


    This was because Ext.form.Panel was not wrapped in a <form> tag.
    Sencha Inc.
    Robert Dougan - @rdougan
    Sencha Touch 2 and Ext JS 4 Core Team Member, SASS/Theming Wizard.