Bruno Finger
Bruno Finger

Reputation: 2573

ExtJS - Change field value without firing the "change" event

I'm writing a function in a ViewController which will reset all of the fields in a complex View. This view is using ExtJS 5 two-way data binding with a ViewModel. That's how I'm reseting the fields:

clearFields: function() {
    var vm = this.getViewModel();

    vm.set('name', '');
    vm.set('address', '');
    vm.set('port', '');
    vm.set('active', false);
    vm.set('dynamic', false);
    vm.set('bandwidthOptimization', true);
    vm.set('reverse', false);
    vm.set('timeout', 60);
    vm.set('camerasEnabled', 1);
    vm.set('username', '');
    vm.set('password', '');
    vm.set('vendorGuid', '');
    vm.set('modelGuid', '');
    vm.set('subscriber', '');
    vm.set('event', '');
    vm.set('partition', '');
    vm.set('instructions', '');
}

But each time I use the set method, it fires the change event of its field, which then is captured back by the controller and do other interactions with the page that are not wanted in this case. So I need to suppress this event from being triggered temporarily. How can I accomplish this?

Upvotes: 1

Views: 4253

Answers (1)

Greendrake
Greendrake

Reputation: 3734

If you were setting values on the fields directly (i.e. not via a viewmodel), perhaps you could use setRawValue. But if you need to keep doing it the way you quoted, then here is a solution:

In order to prevent a field from firing the change event, its private suspendCheckChange property needs to be greater than 0. Therefore you could implement a method to walk through your fields and increase the property before doing your reset, and then, once reset is done, get the property value back where it was. Example:

suspendChange: function(suspend) {
    var fields = Ext.ComponentQuery.query('field', this.getView()),
        i = 0;
    for (; i < fields.length; i++) {
        if (suspend) {
            fields[i].suspendCheckChange++:
        } else {
            fields[i].suspendCheckChange--;
        }
    }
},
clearFields: function() {
    this.suspendChange(true);
    // do reset stuff
    this.suspendChange(false);
}

Upvotes: 1

Related Questions