I use a json service for my grid. There are 3 grids where i use the same service. What i do now is load this service each time for the grids
storeGridEvents = new Ext.data.Store({
model: 'intern',
proxy: {
url: storeUrl,
reader: {
type: 'json',
root: 'data'
}
}
});
storeGridEventData = new Ext.data.Store({
model: 'dataEvents',
proxy: {
url: storeUrl,
reader: {
type: 'json',
root: 'data'
}
}
});
storeGridEventLocation = new Ext.data.Store({
model: 'locations',
proxy: {
url: storeUrl,
reader: {
type: 'json',
root: 'data'
}
}
});
Is there a way i load the service just once and use it for three models? That would save some loading time.
You can load store once and then clone it so you will have two more local copies.
Update: here is example of simple cloning store function:
cloneStore: function(store, storeClass) {
var new_st = Ext.create(storeClass),
recs = [];
store.each(function(r) { recs.push(r.copy)});
new_st.add(recs);
return new_st;
}
Related
I want overwrite grid filter to filter empty and not empty checkbox
If store is already exists, you can add filter
store.addFilter(function(rec){
return rec.get('dataIndex name') === true; // or other flag. if it's bool value === no need;
});
in new store you can add filter
Ext.create('Ext.data.Store', {
model: 'User',
proxy: {
type: 'ajax',
url: '/users',
reader: {
type: 'json',
root: 'users'
}
},
filters: [
function(rec) {
return rec.get('dataIndex name') === true;
}
]
});
I'm migrating a small app from Extjs4 to 6.5. The problem is the treestore, which is very simple, but I cannot find out why the server routine is not called and also the exception-events are not called. I must overlook something, but I cannot find it.
The tree store is:
Ext.create("Ext.data.TreeStore", {
fields: ['mnu_Name'],
proxy: {
type: 'ajax',
headers: { "Content-Type": 'application/json' },
api: { read: '/Secure/WebServices/PageLayout.asmx/LoadMenuII' },
reader: {
type: 'json',
root: function (o) {
if (o.d) {
return o.d.data;
} else {
return o.children;
}
}
},
listeners: {
exception: function () {
alert('exception');
}
}
},
listeners: {
exception: function () {
alert('exception');
}
}
});
When I call the server routine with a plain Ajax call is works fine.
Ext.Ajax.request({
async: true,
url: '/Secure/WebServices/PageLayout.asmx/LoadMenuII',
headers: { 'Content-Type': 'application/json' },
success: function (response, options) {
//Extract data from the response
var data = Ext.decode(response && response.responseText || null, true);
//check op success=false
if (!data || data.success !== true) {
var errNumber = data && data.errNumber || 'Unknown',
errDescription = data && data.errDescription || 'Unknown';
Ext.Msg.alert("Warning", Ext.String.format(thisComp.errFormat, 'Warning in loading the menu definitione.', errNumber, errDescription), null, this, 9000)
return;
}
}
});
Any suggestion what I missed?
Thanks.
Arno
The rest interface I'm currently working has something like this,
Returns a collection
POST /base/Holiday/getHolidaySetup/
FORM_DATA: client_id:1
Even worse..
POST /base/Holiday/setAddHoliday/
FORM_DATA: client_id:1
... other form data..
Clearly in a newer scheme, it'd look something like
/base/Holiday/client/
POST to create a new holiday.
/base/Holiday/client/
GET To retrieve holidays
But, that's just not what we're working with..
So how do I set Backbone up for such a scheme.
You can completely change how your models and collections handle their persistence by overriding their respective sync methods.
For example, to fetch a collection
var M = Backbone.Model.extend({
idAttribute: "client_id"
});
var C = Backbone.Collection.extend({
model: M,
url: "/base/Holiday/getHolidaySetup/",
sync: function(method, model, options) {
var params = {
type: 'POST',
dataType: 'json',
data: JSON.stringify({client_id: 1}),
url: _.result(this, 'url'),
processData: false
};
var xhr = Backbone.ajax(_.extend(params, options));
model.trigger('request', model, xhr, options);
return xhr;
}
});
http://jsfiddle.net/7L9v5rkz/5/
or to save a model
var M = Backbone.Model.extend({
idAttribute: "client_id",
url: '/base/Holiday/setAddHoliday/',
sync: function(method, model, options) {
options = options || {};
var params = {
type: 'POST',
dataType: 'json',
processData: false
};
if ((method === 'create') || (method === 'update')) {
params.url = _.result(this, 'url');
params.data = JSON.stringify(this.toJSON(options));
} else {
// handle read and delete operations
}
var xhr = Backbone.ajax(_.extend(params, options));
model.trigger('request', model, xhr, options);
return xhr;
}
});
http://jsfiddle.net/7L9v5rkz/2/
Good Morning,
I have a search endpoint that I that works when I call it like this:
Ext.Ajax.request({
url: '/Search/False',
method: 'POST',
headers: { 'Content-Type': 'application/json' },
params: 'Attribute:ClosedDT;Value:2014-12-16',
success: function(conn, response, options, eOpts) {
alert(conn.responseText);
},
failure: function(conn, response, options, eOpts) {
alert(conn.responseText);
}
});
I want to use a proxy to load it into a store directly. After much googling I have tried this and i get back a POST /Search/False?_dc=1418738135737 net::ERR_EMPTY_RESPONSE
See current code below:
var proxyDefinition = {
type : 'rest',
api : {
read : '/Search/False'
},
actionMethods : {
read : 'POST'
},
reader : {
type : 'json'
},
paramsAsJson:true
};
returnValue = Ext.create('Ext.data.Store', {
model: 'Mdl1',
proxy: proxyDefinition
});
returnValue.load({params: 'Attribute:ClosedDT;Value:2014-12-16'});
The params config needs to be an object, not a string. Extjs will encode it for you because of paramsAsJson: true.
You should use:
params: {
Attribute: 'CloseDT',
Value: '204-12-16'
}
how to add or save data that getting from ajax request to store or to model sencha touch 2
I have controller, store and a model. Ext.Ajax.request(); is called from controller and when it was successful I want move that data to store in json format
Ext.define('Myapp.controller.HomeController', {
extend: 'Ext.app.Controller',
config: {
control: {
"#homepage_id": {
show: 'onHomepage_idShow'
}
}
},
onHomepage_idShow: function (component, eOpts) {
var token = localStorage.getItem('Token'); //**************************************
console.log('test home', token);
var customHeaders = {
'Content-Type': 'application/json; charset=utf-8',
'ApiAuth': token
};
this.callAjax(customHeaders);
},
callAjax: function (headers) {
var customHeaders = headers;
Ext.Ajax.request({
url: 'http://localhost:9098/Folder/json/Get',
params: Ext.util.JSON.encode({
folderId: 0
}),
method: 'POST',
headers: customHeaders,
success: function (response) {
var decode_text = Ext.decode(response.responseText);
/*I want to add decode_text to a store from this contoller..*/
//var storez = Ext.data.StoreManager.lookup('commomStore_id');//****************
//this.getDataList().setStore(storez);
console.log(storez);
// process server response here
},
failure: function (response, opts) {
Ext.Msg.alert('Error', 'Error while submitting the form');
console.log(response.responseText);
},
scope: this
});
My Store:
Ext.define('Myapp.store.CommonStore', {
extend: 'Ext.data.Store',
requires: [
'Myapp.model.AuthTokenmodel'],
config: {
autoLoad: true,
model: 'Myapp.model.AuthTokenmodel',
storeId: 'commonStote_id',
proxy: {
type: 'localstorage',
id: 'commomStore_id',
reader: {
type: 'json'
}
},
fields: [{
name: 'authtoken'
}]
}
});
For that you have to parse your response and create Myapp.model.AuthTokenmodel objects out of it and then add those objects to your store using add method.
BTW if your response is in JSOn format you should parse it to JSON instead of text like this:
var respObj = Ext.JSON.decode(response.responseText);
console.log(respObj);
then create model objects using respObj data and add those to store:
var storez = Ext.data.StoreManager.lookup('commomStore_id');
storez.add(Ext.create('Myapp.model.AuthTokenmodel', {authtoken : respObj.authToken}));
Ext.getStore('commomStore_id').loadData(decode_text);