CODEWITHSUNDEEP
javascriptsencha-touchextjs
binarious
binarious

Reputation: 4588

Sencha Touch Checkbox select on label click

I have some checkboxes in my app:

http://img846.imageshack.us/img846/7397/628bc474d4904ff2993df81.png

Now I want to trigger/toggle selection when the labels are clicked.

Any ideas?

Upvotes: 2

Views: 5634

Answers (3)

Thijs Kuipers
Thijs Kuipers

Reputation: 475

If you want to achieve the same in Sencha Touch 2, you can use the following for radiofields or checkboxes:

defaults: {
    xtype: 'radiofield',
    name: 'fieldname',
    listeners: {
        // Adding listener for tap event on label element,
        // this should toggle the checkbox.
        "tap": {
            element: "label",
            fn: function () {
                var me = this;
                me.setChecked(!me.isChecked());
            },
        }
    }
}

EDIT: Apparently, the "click" event should be "tap", according to @jayteejee. Changed the original "click" listener to a "tap" listener accordingly.

Upvotes: 5

jayteejee
jayteejee

Reputation: 91

Thijs' answer worked well with a minor adjustment to get it working on Android and iOS with Sencha Touch 2. Just change "click" to tap:

{
    xtype: 'checkboxfield',
    name: 'fieldname',
    label: 'Label',
    listeners: {
        tap: {
            element: "label",
            fn: function () {
                this.setChecked(!this.isChecked());
            }
        }
    }
}

Upvotes: 1

ilija139
ilija139

Reputation: 2974

Use this to add tap listener to the label element. 

{
    id: 'username',
    xtype: 'checkboxfield',
    name : 'username',
    label: 'User Name',
    listeners:{
        labelEl:{
           tap:function(){
              var obj = Ext.getCmp('username');
             if(obj.isChecked()){
                    obj.uncheck();
              }else{
                    obj.check();
              }
           }
        }
    }
}

Upvotes: 3

Related Questions