javascript - ExtJS Change Event Listener failing to fire -

I was asked to post it as a question on the stack overflow by which it was then ritored by many others I went. I have already become an ugly solution, but posting the original issue as per the request.

This is the story of the back of this type. We have a large database application that uses exclusively for client side view exclusively. We are using a GridPanel (Extrgrated GridPanel) for a line view loaded from a remote store.

In each of our interfaces, we have a formpanel (extension.form panel) that allows the user to create or edit records from the gridpanel. Gridpanel columns are bound to formphen form elements so that when a record is selected in the gridpanel, all the values ​​are in the form.

On each form, we have an input field for table row ID (primary key), which is defined as:

  var editFormFields = [ FieldLabel: 'id', id: 'id_field', name: 'id', width: 100, has been read only: true, // user can never change ID: MonitorValid: true} / * other fields deleted * /];  

So, all this is fine and it works on all of our applications. While creating a new interface, a requirement was made that we created a third-party file storage Requires API access, which provides interface as a small webpage loaded in IFrame.

I have placed the IFrame code inside the html parameter of the FormPenel:

  var editForm = new Ext.form.FormPanel ({html: '
  & lt; / Div & gt; ', / * bunch of other parameters tampered for brief); Therefore, whenever a user selects a record, then I have to change the src attribute of IFrame to the API URL of the service we are using. Something on the lines of {$ Id_of_record_selected}  
 I initially went to the id field (pasted above) and added a change listener.  
  var editFormFields = [{fieldLabel: 'id', id: 'id_field', name: 'id', width: 100, read only: true, // user ID not changed could ever. MonitorValid: true, listeners: {change: function (f, new_val) {alert (new_val); }}} / * Other fields deleted * /];  
 
 Good and simple, except that it only worked when the user focused on that form element. All the time he failed to fire. 
 
 Frustrated that I had a deadline and only needed to work, I quickly applied a corrosive polar that checks the value. This is a terrible, ugly hack. But it works as expected 
 
 I will paste my ugly dirty hack in response to this question. 
 

"Gridpanel columns are bound to formphen form elements so that when selecting a record in the gridpanel If done, all values ​​come in the form. "

As I have understood, this is the rowclick event from the above quote, which actually triggers the change in your form in the first place. To avoid voting, this may be the place to listen, and eventually increase the incidence of your custom changes.