I am developing application using ExtJS 4.1. I have one spinner field and I want to change value of that method programatically. I have set up listeners like change, spinup and spindown for this same spinner field.
Now I would like to know how to prevent listener method of these events getting fired only when I change the value of spinner field through my program?
For example,
var mySpinner = Ext.ComponentQuery.query('#foopanel > #mySpinner')[0];
mySpinner.setValue(2000);
When mySpinner.setValue(2000); line is executed, change event of mySpinner gets fired and as I have listener method for this change event, that listener method is executed.
Is it possible to prevent invocation of change event listener method?
Thanks..
You could suspend all events by calling
mySpinner.suspendEvents();
mySpinner.setValue(2000);
mySpinner.resumeEvents();
That would be the cleanest an easiest way IMO
And that's also a usecase why this methods exist
Related
How I can check if event was fired programmatically?
Namely I have an Ext.tree.Panel and listen for it selectionchange event. How I can check within handler if event was fired manually by user (row click) or via select() method?
option 1 :
For most of the events eOpts arguments is passed to event. Depending on the event this is fill by ExtJs. If event is fired manually thus eOpts is never filled or filled customly.
option 2:
If manual event firing is happens in code you can manipulate add a custom argument
As far as I know and my research there is no solution based on scope of selectionchange event. However from a design perspective this is how it should be since selectionchange event should not depend on caller. From what is told I can say that 2 different event is needed. Where different action is taken. (which is the definition of an event :))
Therefore my suggestion is to override select method and fire a custom event in which you do what you want do differently. If needed in rowclick event another custom event can be fired.
You can override this in subclasses or you can use Ext.override for global scope.
You can't, really. The "best" way would be to listen for an itemclick event and check whether the selectionchange event fired within some small threshold amount.
The main point of the question: I need the event that fires when the new rows have been rendered and the selection has been restored.
I refresh my grid by calling store.load method. I have a handler for store.load event. It fires when data have been loaded, but before new rows rendering.
I tried afterrender, viewready, selectionchange both in Ext.grid.Panel and Ext.view.Table (the view of the gird), but these events don't fire after every store.load event.
I need this event to work with the restored selection and perform some operations.
instead of calling the load call doRefresh() it will fire beforechange event and change events on the paging toolbar then handle those things in those events do what ever you want todo
you can use:
grid.getView().refresh();
method after store load. It will refresh grid view content.
I need an event which will be fired when items in DataView are ready as DOM elements, when refresh() is fireing the items are still not ready
Thanks
viewready may not be used becouse it fires only onse, I need handle event after each refresh
I think viewready is what you are after. If this doesn't work, afterrender should.
If you need an event that fires AFTER refresh has completed then you can add one. Within the view component of your choice, or within a dataview override that would apply to all dataviews, override the refresh function, call its parent and fire a custom event when it's complete:
refresh : function () {
this.callParent(arguments);
this.fireEvent('afterrefresh')
}
You can listen for that event like any other e.g.
me.on({
afterrefresh : me.doSomethingAfterRefresh,
scope : me
});
I have a navigation view with one button in the toolbar. Based on the view pushed, the button's label and functionality should chang. I've managed to do this by creating many buttons and activating them as needed (hide/show)
Instead of doing that approach I'd like to have just one button and in the controller change the text and action. Something along these lines:
this.getButton().setHtml("new text");
this.getButton().action = "newaction";
setHtml works, but setting the action doesn't. Examining the button in the console, I see the action changes but when I click it, it responds to the previous action.
Any suggestions on how to approach this?
Thanks
You should use setText instead of setHtml that, err... Doesn't seem to exist! And setHandler to change the handler function.
Alternatively, since you say that you're working in a controller, you can attach a function to the click event of the button and, inside this listener function, decide what action to execute in the current context.
I know that I can add a listener to the change event, but it will fire only when user changes the value. Is there a way to setup a similar listener for programmatic change as well?
if you use setValue() method that should fire your change event.
You can fire event after programmatic changes.
cmp.fireEvent('change', cmp, newValue, oldValue)