"Translator" Ext JS latest tricks--2014-10-30

Original: Top Support Tips

Greg Barry:ext JS 5 extraparams

EXT JS 4 allows users to add extraparams directly to a link, similar to the following code:

Ext.Ajax.extraParams = {foo: "Bar"};

Since ext JS5 has modified the packet, the method is no longer feasible. Now, you need to use the Setextraparams and Getextraparams methods to provide parameters for Ext.data.Connection, for example:

Ext.Ajax.setExtraParams ({    foo: "Bar"             });

For more information about these methods, please read the following resources: Ext.data.Connection

You can view a demonstration of this feature by looking at the "list" in the Network tab in the title of fiddle.

Dynamic fields and Grid columns in Seth lemmons:ext JS 4

The changes in the data packet of EXT JS 5 make flexible data easier to work with. However, if you are using Ext JS 4, it is necessary to use a few little-known framework blocks to achieve similar flexibility.

Developers have long been unable to control which data fields are returned from the server to the application. This is probably a common challenge if you are working on an environment where data will return data from multiple data sources. Data signatures can change frequently, and data owners do not notice that the data signature has changed. The user often statically sets a field for the model/store (or column in the grid). However, you can use the Metachage event and the returned Metadaata key to make the data flexible.

Note: The Metachange event is currently only triggered by the JSON Reader (reader).

If the server responds with the metadata key set in the reader's metaproperty configuration item, the data can be obtained from the metadata response. The root of any passed data record can be defined here as a stored field. If the record object is passed through the metadata object, the field is automatically applied to the storage/model by the reader.

The response-related information is also passed back to the response, for example, an array column of an associated store can also be passed, and can be applied dynamically using the stored Metachange event.

When metadata is passed back to the response, the Metachange event is triggered, and the handler can read any data that is passed back and merge it.

var store = ext.create (' Ext.data.Store ', {    //...    Listeners: {        ' Metachange ': function (store, meta) {            mygrid.reconfigure (store, meta.columns);}}    );

Ideally, each load does not need to reconfigure the grid unless the field/column needs to be reconfigured. However, it is best to use the metadata in the returned response when the field or column changes.

For more information about Metachange events and metadata configuration items, see the following resources:

• Metachange
• MetaData

"Translator" Ext JS latest tricks--2014-10-30