ExtJS 4: How do I configure the repository to load models for a specific set of identifiers?

Question

For example, let's say I have a server API for loading people who process such requests: GET / people /? id = 101,329,27

I would like to create a Store (probably a custom class that extends Ext.data.Store), which - provided that it has a list of people ids - causes the proxy to make a request like the one shown above, so that the data returned is only for this subset of faces.

I saw the documentation regarding remote filtering, but I'm worried that to use it, I first need to call store.load (), which will load all faces, and then call filter () to remotely filter. I would just upload a subset of people for the first time.

Thanks for any advice!

Answer 1

Found a solution (although it is still open to the perception of other ideas).

First, you can call the store load () function with the configuration object that will be passed to the operation. The API documents for Ext.data.Operation make it clear that one of the configuration parameters is for an array of Filter objects, so you can do this:

var idFilter = Ext.create('Ext.util.Filter', { property: 'id', value: '100,200,300' }); myStore.load({ filters: [ idFilter ] }); 

This results in a query in which the query string contains ?filter=[{"property"%3Aid%2C"value"%3A100,200,300}] (in other words, the URL-encoded version [{ property: 'id', value: '100,200,300'}] ).

You can also just call myStore.filter('id', '100,200,300') without first calling .load() . Assuming you have remoteFilter = true in your store, this will make a request with the same request parameters shown by agove.

Sidenote: You can change the keyword used for 'filter' by setting the filterParam configuration parameter for the proxy. For example, if filterParam = q, then the above sequence of changes changes to ?q=[{"property"%3Aid%2C"value"%3A100,200,300}]

Second , you can control the "structure" of the filter in the query string. In my case, I did not want something like filter = {JSON}, as shown above. I need a query string that looks like this ?id=100,200,300 For this, I needed to expand the proxy server and override the default getParams () function:

 Ext.define('myapp.MyRestProxy', { extend: 'Ext.data.proxy.Rest', /** * Override the default getParams() function inherited from Ext.data.proxy.Server. * * Note that the object returned by this function will eventually be used by * Ext.data.Connection.setOptions() to include these parameters via URL * querystring (if the request is GET) or via HTTP POST body. In either case, * the object will be converted into one, big, URL-encoded querystring in * Ext.data.Connection.setOptions() by a call to Ext.Object.toQueryString. * * @param {Ext.data.Operation} operation * @return {Object} * where keys are request parameter names mapped to values */ getParams: function(operation) { // First call our parent getParams() function to get a default array // of parameters (for more info see http://bit.ly/vq4OOl). var paramsArr = this.callParent(arguments), paramName, length; // If the operation has filters, we'll customize the params array before // returning it. if( operation.filters ) { // Delete whatever filter param the parent getParams() function made // so that it won't show up in the request querystring. delete paramsArr[this.filterParam]; // Iterate over array of Ext.util.Filter instances and add each // filter name/value pair to the array of request params. for (var i = 0; i < operation.filters.length; i++) { queryParamName = operation.filters[i].property; // If one of the query parameter names (from the filter) conflicts // with an existing parameter name set by the default getParams() // function, throw an error; this is unacceptable and could cause // problems that would be hard to debug, otherwise. if( paramsArr[ queryParamName ] ) { throw new Error('The operation already has a parameter named "'+paramName+'"'); } paramsArr[ queryParamName ] = operation.filters[i].value; } } return paramsArr; } }); 

Answer 2

You can also get a Model object to load the record itself. Using the controller, you can:

 this.getRequestModel().load(requestID,{ //load from server (async) success: function(record, operation) { ..... } } 

where Request is the class of the model and requestID is the identifier for the search. In this case, the proxy must also be defined by the model object:

 proxy: { type: 'ajax', reader: { type:'json', root: 'data' }, api: { create : 'request/create.json', //does not persist read : 'request/show.json' } }