Daruma
Daruma

Reputation: 3

sencha touch form - How to get field values when I click submit

I new in sencha touch and I make a simple login form wichh accepts username and password from a user. When I click submit, The fields value of form will viewed in javascript alert in JSON format. I create my form in views application. Here's my code:

var formPanel = Ext.define('GS.view.Login', {
    extend: 'Ext.form.Panel',
    xtype: 'loginform',

    requires: [
        'Ext.form.FieldSet'],

    config: {
        title: 'Login',
        iconCls: 'home',
        url: 'authenticate_page.php',
        items: [{
            xtype: 'fieldset',
            title: 'Login',

            items: [{
                xtype: 'textfield',
                name: 'txt_username',
                label: 'Username'
            }, {
                xtype: 'passwordfield',
                name: 'txt_password',
                label: 'Password'
            }]
        }, {
            xtype: 'button',
            text: 'Allow me in',
            ui: 'confirm',
            handler: function () {
                var values = this.getValues();
                alert(values);
            }
        }]
    }
});

I tried some ways but it isn't work. Please help.

Upvotes: 0

Views: 7129

Answers (3)

Gayathri Mohan
Gayathri Mohan

Reputation: 2962

Hi if you want to get the values from the particular field means always use

     Ext.getCmp('Username').getValue(),   // id of the field


     Ext.getCmp('Password').getValue(),

Upvotes: 1

Jacob Nelson
Jacob Nelson

Reputation: 2476

You need to add "id" for the form element

            items: [
                {
                    xtype: 'textfield',
                    name: 'txt_username',
                    label: 'Username',
                    id: 'Username'
                },
                {
                    xtype: 'passwordfield',
                    name: 'txt_password',
                    label: 'Password'
                    id: 'Password'
                }
        ]

after this, you can get the value using the method Ext.get(id);

for example

Ext.get('Username')
Ext.get('Password')

Upvotes: 0

Lionel Chan
Lionel Chan

Reputation: 8069

In your button's handler

var values = this.getValues();
alert(values);

The this is referring to your button and of course your button does not bear with any form values.

To get the form values, do this:

handler: function() {
    var values = this.up('form').getValues();
    //or:
    //var values = formPanel.getValues();
    console.log(values);
}

Checkout the documentation for Ext.form.Panel. It has enough examples to guide you through.

Upvotes: 2

Related Questions