Results 1 to 4 of 4

Thread: Form parameters showing up in address bar upon "ENTER"

  1. #1
    Sencha User
    Join Date
    Jun 2009
    Posts
    47
    Answers
    3

    Default Form parameters showing up in address bar upon "ENTER"

    Hello,

    I have a simple Ext.form.FormPanel for a user to sign in to the app. When testing in a Chrome browser, I noticed that when the user enters the ID and password, and instead of clicking/tapping the login button, just hits "Enter", the app just reloads and, worse, the ID and password that were already entered in the form fields show up as plain encoded text in the address bar.

    Sample screenshots:

    #1 - User has entered the login information and instead of clicking/tapping the big "Sign In" button, is about to just hit "Enter":

    Screen Shot 2016-05-22 at 11.46.30 AM.jpg



    #2 - The app has reloaded (and the form has switched to the default "Join" tab) and the login form parameters are now showing up in the address bar:
    Screen Shot 2016-05-22 at 11.48.00 AM.jpg



    My questions:

    1. Why is hitting "Enter" causing this behavior of app reload instead of form submission?

    2. Is there anyway to avoid the ID/pwd showing up in the address bar? Do I have to somehow capture the "Enter" and negate it, and force the user to click/tap the login button? Or do I capture the "Enter" and trigger the login button click/tap somehow?

    If the user clicks/taps on the button, things are just fine - the app logs the user in and the address bar does not get populated with the user ID/pwd.

    Any help is appreciated.

    Thanks,

    Mohamamd
    San Jose, CA

  2. #2
    Sencha User alex.volfson's Avatar
    Join Date
    Jan 2016
    Posts
    462
    Answers
    60

    Default

    If you have submitOnAction set to true then this is the expected behavior. See http://docs.sencha.com/touch/2.4/2.4...submitOnAction

  3. #3
    Sencha User
    Join Date
    Jun 2009
    Posts
    47
    Answers
    3

    Default

    Thanks for the information. I had double-checked this myself - I have not made any changes to submitOnAction and have left it as default.

    My formpanel is as follows:
    Code:
            var fPanel = Ext.create('Ext.form.FormPanel', 
            {
                xtype: 'formpanel',
                centered: true,
                height: '100%',
                width: formWidth,
                scrollable: false,
                items: [
                              {   xtype: 'spacer', height: 20 },
                    {
                        xtype: 'fieldset',
                        style: 'padding-left:5%;padding-right:5%',
                        items: [
                            {
                                xtype: 'emailfield',
                                label: '',
                                placeHolder: 'E-mail',
                                cls: 'startScreenFields',
                                value: '',
                                name: 'email'
                            },
                            {
                                xtype: 'passwordfield',
                                label: '',
                                placeHolder: 'Password',
                                cls: 'startScreenFields',
                                value: '',
                                name: 'pwd'
                            }
                        ]
                    },
                    {   xtype: 'spacer', height: 20 },
                    {
                        xtype: 'container',
                        style: 'padding-left:5%;padding-right:5%',
                        layout: 'hbox',
                        items: [
                        {
                            xtype: 'button',
                            flex: 1,
                            cls:'blueButton',
                            width: '100%',
                            text: 'Sign In',
                            handler: function() {
                                this.up('signinpanel').processSignIn(this.up('formpanel'));
                            }
                        }]
                    },
                    {   xtype: 'spacer', height: 20 },
                    {
                        xtype: 'container',
                        layout: {
                            type: 'vbox',
                            align: 'center'
                        },
                        items: [
                            {
                                xtype: 'container',
                                padding: 4,
                                style: 'font-size:1.2em',
                                html: '<a>Forgot Password</a>',
                                listeners: {
                                    element: 'element',
                                    tap: function() {
                                        this.up('signinpanel').forgotPassword();
                                    }
                                }
                            }
                        ]
                    }
                ]
            });
    The form panel works just fine if the "Sign In" button is clicked/tapped as expected. Any ideas as to what may be causing this issue? Interestingly, I have a searchBar object in my app. If I enter search text in the searchBar text field and hit "Enter", it works fine as expected and does not cause the app to reload with parameters showing up in the address bar.

    Any help is appreciated.

    Thanks,
    Mohammad

  4. #4
    Sencha User alex.volfson's Avatar
    Join Date
    Jan 2016
    Posts
    462
    Answers
    60

    Default

    Does this only occur in chrome desktop? Does it occur on any mobile devices?

Similar Threads

  1. Replies: 1
    Last Post: 13 Nov 2015, 12:12 PM
  2. Replies: 29
    Last Post: 1 Jun 2012, 8:34 AM
  3. Replies: 4
    Last Post: 25 Jan 2012, 7:18 AM
  4. Ext.ux.IpV4Field -- form field for entering IP v4 address in "Windows style"
    By ReBorn in forum Ext 3.x: User Extensions and Plugins
    Replies: 3
    Last Post: 5 Oct 2010, 2:46 AM
  5. When click "Enter" in form panel, the IE browser will refreshed.
    By qgj2046 in forum Ext 3.x: Help & Discussion
    Replies: 0
    Last Post: 3 Dec 2009, 10:19 PM

Tags for this Thread

Posting Permissions

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