How can I access the function getTree in my TreeStore-Instance from the configuration of the DirectProxy? Like this etc. nothing works....
Is somebody able to help me?
Ext.define('PM.store.Projects', {
extend: 'Ext.data.TreeStore',
model: 'PM.model.Project',
autoLoad: true,
/*proxy: {
type: 'ajax',
url: 'data/projectTree.json',
reader: {
type: 'json',
},
},
root: {
name: 'Test',
id: -1,
}*/
proxy: {
type: 'direct',
directFn: PM.controller.Projects.getTree,
},
/*root: {
name: 'Demo',
children: [
{
name: 'Test',
leaf: true,
},
],
},*/
getTree: function() {
alert("Test");
}
});
You can build you proxy in the constructor I suppose.
Ext.define('PM.store.Projects', {
extend: 'Ext.data.TreeStore',
model: 'PM.model.Project',
autoLoad: true,
constructor: function(config) {
var me = this;
Ext.apply(me, config);
me.proxy = {
type: 'direct',
directFn: me.getTree
};
me.callParent();
},
getTree: function() {
alert("Test");
}
});
Related
how can I pass parameters from the view to the store in extjs?
this is my store:
Ext.define('mycomponents.store.mystore', {
extend: 'Ext.data.Store',
alias: 'store.levels',
model: 'mycomponents.model.mymodel',
storeId: 'levels',
restful: true,
autoLoad: true,
proxy: {
type: 'ajax',
headers: {
'Accept': '*/*',
'Cache-Control': 'no-cache',
'Content-Type': 'application/json',
'Authorization': localStorage.token
},
extraParams: {
sort: 'levelid',
'filter[active]': true,
'filter[idparent]': 0
},
reader: {
type: 'json',
root: 'data',
successProperty: 'success'
},
writer: {
type: 'json',
writeAllFields: true,
encode: true,
root: 'data'
},
listeners: {
exception: function (proxy, response, operation) {
var error = Ext.decode(response.responseText);
Ext.MessageBox.show(
{
title: 'REMOTE EXCEPTION',
msg: error.message,
icon: Ext.MessageBox.ERROR,
buttons: Ext.Msg.OK
}
);
}
},
actionMethods: {
read: 'GET'
},
api: {
read: 'http://url...',
create: 'http://url...',
update: 'http://url...',
destroy: 'http://url...'
},
autoSave: true
},
constructor: function (config) {
this.callParent([config]);
}
});
My view:
var store = Ext.create('mycomponents.store.mystore', {});
Ext.define('mycomponents.view.myview', {
extend: 'Ext.container.Container',
id: 'leves',
alias: 'widget.levels',
xtype: 'levels',
items: [
{
xtype: 'combobox',
...
}
]
...
}
I need from the view send 'filter[idparent]': 1, 'filter[idparent]': 2, or whatever on combobox change. How can I achieve this?
You need to attach on change listener in combobox and use method setExtraParam in store.
Example:
Ext.define('mycomponents.view.myview', {
extend: 'Ext.container.Container',
id: 'leves',
alias: 'widget.levels',
xtype: 'levels',
items: [
{
xtype: 'combobox',
listeners:{
change: function (cmp, newV, oldV, opt) {
Ext.getStore('levels').getProxy().setExtraParam('filter[idparent]', newV);
Ext.getStore('levels').load();
}
}
...
}
]
...
}
Model
Ext.define('MyDesktop.model.mail.MailFoldersModel', {
extend: 'Ext.data.Model',
requires: [
'Ext.data.field.String'
],
fields: [
{
type: 'string',
name: 'id'
},
{
type: 'string',
name: 'idParent'
},
{
type: 'string',
name: 'text'
}
]
});
My TreeStore
Ext.define('MyDesktop.store.mail.MailFoldersStore', {
extend: 'Ext.data.TreeStore',
requires: [
'MyDesktop.model.mail.MailFoldersModel'
],
constructor: function(cfg) {
var me = this;
cfg = cfg || {};
me.callParent([Ext.apply({
storeId: 'MailFoldersStore',
model: 'MyDesktop.model.mail.MailFoldersModel',
autoLoad: true,
proxy: {
type: 'ajax',
url: 'http://url/mail/folders',
reader: {
type: 'json',
rootProperty: 'items',
successProperty: 'success'
}
},
root: {
text: 'root',
iconCls: 'mail-folders-owner'
}
}, cfg)]);
}
});
Store is autoloaded, all works correctly, store contains 11 records.
var MailFoldersStore = Ext.create('MyDesktop.store.mail.MailFoldersStore', {
storeId: 'MailFoldersStore'
});
If I set autoLoad to false and trying to load by manually - store is empty, 0 records.
var MailFoldersStore = Ext.create('MyDesktop.store.mail.MailFoldersStore', {
storeId: 'MailFoldersStore'
});
MailFoldersStore.load({
callback : function(records, operation, success) {
console.log(records);
}
});
What can be a reason for this behaviour?
I also has same problem. I am using Extjs 5.1. After googling I found one complex solution which needs us to modify the framework.
See the below link if it can help you.
http://www.sencha.com/forum/showthread.php?154823-listeners-quot-exception-quot-in-proxy.ajax-on-TreeStore-do-not-work
Ext.define('MyApp.controller.Main', {
extend: 'Ext.app.Controller',
models: [
'User'
],
stores: [
'userStore'
],
refs: [
{
ref: 'navigation',
selector: 'navigation'
},
{
ref: 'ContentPanel',
selector: 'ContentPanel'
},
{
ref: 'viewport',
selector: 'viewport'
},
{
autoCreate: true,
ref: 'myForm',
selector: 'MyForm',
xtype: 'MyForm'
},
{
autoCreate: true,
ref: 'usergrid',
selector: 'usergrid',
xtype: 'userGrid'
}
],
onSaveButtonClick(button,e,eopts){ var form1 = this.getMyForm();
if(form1.isValid())
{
var form = form1.getForm();
user= this.getUserModel().create(
{
firstName: form.findField('firstName').getValue(),
midName: form.findField('midName').getValue(),
lastName: form.findField('lastName').getValue(),
gender: form.findField('gender').getValue(),
age: form.findField('age').getValue(),
buildingName: form.findField('buildingName').getValue(),
street: form.findField('streetName').getValue(),
country: form.findField('country').getValue(),
pinCode: form.findField('pinCode').getValue(),
state: form.findField('state').getValue()
});
debugger;
var store= this.getUserStoreStore();
store.data.add(user);
var List= this.getUsergrid();
List.getStore().load();
var contentPanel = this.getContentPanel();
contentPanel.removeAll(true);
contentPanel.add(List);
form1.close();
alert('Data stored Successfully');
}
else
{
alert('Few Datas are missing!!');
}
//Store
Ext.define('MyApp.store.userStore', {
extend: 'Ext.data.Store',
alias: 'store.userStore',
requires: [
'MyApp.model.User'
],
constructor: function(cfg) {
var me = this;
cfg = cfg || {};
me.callParent([Ext.apply({
autoLoad: true,
autoSync: true,
model: 'MyApp.model.User',
storeId: 'userStore',
proxy: {
type: 'ajax',
reader: {
type: 'json'
}
}
}, cfg)]);
}
});
Your code is incorrect for 2 reasons:
1) You should not be modifying the underlying data collection. If it's giving an error, then something else is wrong.
2) If you're loading the store, why are you adding items to it? It should already be loaded.
i made an app in architect. My store is this
Ext.define('MyApp.store.storeMain', {
extend: 'Ext.data.Store',
requires: [
'MyApp.model.modelMain'
],
constructor: function(cfg) {
var me = this;
cfg = cfg || {};
me.callParent([Ext.apply({
autoLoad: false,
storeId: 'storeMain',
model: 'MyApp.model.modelMain',
pageSize: 50,
proxy: {
type: 'ajax',
reader: {
type: 'json',
root: 'Main',
totalProperty: 'Main.totalCount'
}
}
}, cfg)]);
}});
This is my button:
{
xtype: 'button',
text: 'Submit',
listeners: {
click: {
fn: me.onButtonClick,
scope: me
}
}
and this is the function
onButtonClick: function(button, e, options) {
storeMain.load({
url:'test.json'
})
}
},
But it is not loading the store. Instead it is giving this error: storeMain is not defined. I have a viewport.js and other files like the storeMain.js
There is no variable storeMain anywhere. You need to call Ext.getStore('storeMain') to get store reference.
I have two stores: localstorage and a json on the server, I'm trying to download data from json to the local. Please see what's wrong:
/store/Notes.js
Ext.define("NotesApp.store.Notes", {
extend: "Ext.data.Store",
requires: "Ext.data.proxy.LocalStorage",
config: {
storeId: 'Notes',
model: "NotesApp.model.Note",
proxy: {
type: 'localstorage',
id: 'notes-app-store'
},
sorters: [{
property: 'dateCreated',
direction: 'DESC'
}],
grouper: {
sortProperty: "dateCreated",
direction: "DESC",
groupFn: function (record) {
if (record && record.data.dateCreated) {
return record.data.dateCreated.toDateString();
} else {
return '';
}
}
}
}
});
/store/Online.js
Ext.define("NotesApp.store.Online", {
extend: "Ext.data.Store",
config: {
storeId: 'Online',
proxy: {
type: 'jsonp',
url: 'http://server.com/made/qa.php',
reader: {
type: 'json'
//rootProperty: 'results'
}
},
autoLoad: false,
listeners: {
load: function() {
console.log("updating");
// Clear proxy from offline store
Ext.getStore('Notes').proxy.clear();
console.log("updating1");
// Loop through records and fill the offline store
this.each(function(record) {
console.log("updating2");
Ext.getStore('Notes').add(record.data);
});
// Sync the offline store
Ext.getStore('Notes').sync();
console.log("updating3");
// Remove data from online store
this.removeAll();
console.log("updated");
}
},
fields: [
{
name: 'id'
},
{
name: 'date_created'
},
{
name: 'question'
},
{
name: 'answer'
},
{
name: 'type'
},
{
name: 'author'
}
]
} });
When I need to update I called Ext.getStore('Online').load();
But the console is not showing anything else after 'updating'.
I wonder what went wrong?
Use Ext.getStore('Notes').getProxy().clear() instead works