How load data from mySQL to JSON in EXTJS - javascript

I create file in my store folder, i want load my data from mySQL to JSon, so this is my code:
Ext.define('DWP3.store.konten.Coba', {
extend: 'Ext.data.Store',
alias: 'store.coba',
uses: [
'Ext.data.Store'
],
initComponent: function(){
var store = Ext.create('Ext.data.Store', {
fields: [
{name: 'periode'},
{name: 'Teknik Informatika S1'},
],
proxy: {
type: 'ajax',
url : 'resources/data/load2.php',
reader: {
type: 'json',
rootProperty: 'view_aktif'
}
},
autoLoad: true
});
}
});
how can i load the data from store?
Can You Help me Please.

It seems better to me declared this way :
Ext.define('DWP3.store.konten.Coba', {
extend: 'Ext.data.Store',
alias: 'store.coba',
fields: [
{name: 'periode'},
{name: 'Teknik Informatika S1'},
],
proxy: {
type: 'ajax',
url : 'resources/data/load2.php',
reader: {
type: 'json',
rootProperty: 'view_aktif'
},
autoLoad: true
});

Related

ExtJs 4 Proxy Writer and PHP $_POST

I have this store:
Ext.define('strMtoOrganismos', {
extend: 'Ext.data.Store',
model: 'mdlMtoOrganismos',
autoLoad: false,
pageSize: 20,
proxy: {
type: 'ajax',
api: {
read: 'some php url',
update: 'some php url'
},
reader: {
type: 'json',
root: 'data',
totalProperty: 'total',
successProperty: 'success'
},
writer: {
type: 'json',
root: 'data',
encode: true,
writeAllFields: false,
}
}
});
In my controller I have a button that sync the store:
onPulsarGuardar:function(){
Ext.getStore('strMtoOrganismos').sync();
}
And in my php file,printing $_POST[data] I receive for example:
{"codigo_erp_cliente":"243","id":2}
How can I convert this string to an array like:
[codigo_erp_cliente]=>243
[id]=>2
Or an alternative configuration to the store writer?

extjs 5 associations between two models

There are two model and connected stores: user and orders in frontend. There are two api calls in backend: getOrder(orderId), and getOrders().
In 'order store' I specified proxy settings for getOrders(). In 'order model' I specified proxy for getOrder(orderId).
When I call user's load method to get associated orders in this case uses model's proxy. Why not use proxy from store? Why it is not using.
P.S.: relation between user and order is descripted in backend and depends on authentication params of user.
User model code
Ext.define('Dev.models.User', {
extend: 'Ext.data.Model',
requires: ['Dev.stores.Orders'],
fields: [
//data
{name: "name", type: "string"},
{name: "userId", type: "string"}
],
proxy: {
type: 'ajax',
url: '/tcc/getmember',
idParam: 'memberId',
reader: {
type: 'json',
idProperty : 'memberId'
}
},
hasMany: {
model: 'Dev.models.Order',
name: 'orders',
storeConfig: {
type: 'orders',
filters: []
}
}
});
Order model code
Ext.define('Dev.models.Order', {
extend: 'Ext.data.Model',
idProperty : 'orderId',
fields: [
{name: "orderId", type: "string"},
{name: "title", type: "string"},
{name: "createMember", type: "string"}
],
proxy: {
type: 'ajax',
api: {
create: '/tcc/setorder',
read: '/tcc/getorder',
update: '/tcc/setorder',
destroy: '/tcc/deleteorder'
},
idParam : 'orderId',
reader: {
type: 'json',
idProperty : 'orderId'
}
},
belongsTo: {
model: "Dev.models.User",
name: 'user',
getterName: 'getUser',
foreignKey: 'userId',
primaryKey: 'createMember'
}
});
Order store code
Ext.define('Dev.stores.Orders', {
extend: 'Ext.data.Store',
model : 'Dev.models.Order',
alias: 'store.orders',
proxy : {
type : 'ajax',
api: {
create: '/tcc/setorder',
read: '/tcc/getorders',
update: '/tcc/setorder',
destroy: '/tcc/deleteorder'
},
reader : {
root: 'orders',
type : 'json',
idProperty : 'orderId'
}
}
});
Sample of usage
function doMemberOne(userId) {
Dev.models.User.load(userId, {
success: function(record, operation) {
console.log("User model was loaded successfully");
doOrders(record.orders());
},
failure: function(record, operation) {
console.log("User model was loaded unsuccessfully");
}
});
}
function doOrders(orderStore) {
orderStore.load({
callback: function(records, operation, success) {
if (success) {
console.log("Orders was loaded successfully");
} else {
console.log("Orders was loaded unsuccessfully");
}
}
});
}
Ext.onReady(function() {
Dev.Authentication.login("admin", "adminpass", "adminorg");
Dev.Authentication.on('login', function(resp) {
console.log("Login is successful.");
doMemberOne(resp.accountid);
});
});

Loading elements in Ext Panel using Ext ComponentLoader

I have defined a model type that represent an object with xtype 'image'. Now i'm trying to load this objects in Ext.Panel from JSON using ComponentLoader:
Ext.define('ItemModel', {
extend: 'Ext.data.Model',
idProperty: 'itemModel',
fields: [{
name: 'id',
type: 'int'
},{
name: 'xtype',
type: 'string'
},{
name: 'src',
type: 'string'
}]
});
var previews = Ext.create('Ext.Panel',{
layout: 'column',
height: 500,
items: {
loader:{
autoLoad : true,
url: 'php/read.php',
renderer: "component"
}
}
});
But i get such error:
TypeError: me.el is null
me.container = Ext.get(me.el.dom.parentNode);
JSON which returned by read.php looks just like this:
{"items":[{"id":0,"xtype":"image","src":"img\/newalbum.png"},{"id":1,"xtype":"image","src":"img\/newalbum1.png"}]}
But if i'm create a 'store' with 'reader', and trying iterate loaded objects, it's works fine:
Ext.define('ItemModel', {
extend: 'Ext.data.Model',
idProperty: 'itemModel',
fields: [{
name: 'id',
type: 'int'
},{
name: 'xtype',
type: 'string'
},{
name: 'src',
type: 'string'
}]
});
Ext.define('ItemModelStore', {
extend: 'Ext.data.Store',
model: 'ItemModel',
proxy: {
type: 'ajax',
url: 'php/read.php',
reader: {
type: 'json',
root: 'items'
}
}
});
var itemModelStore = Ext.create('ItemModelStore');
itemModelStore.load(function() {
itemModelStore.each(function(record){
alert(record.get('src'));
});
});

ExtJS 4.2.0 undefined model

I thought I had defined a model for my store, but my console and also my application seem to disagree.
My code looks something like this:
Ext.define("Deeper", {
extend: 'Ext.data.Model',
fields: [{
name: 'ID',
type: 'int'
}, {
name: 'someoneElsesID',
type: 'int'
}, {
name: 'anotherID',
type: 'int'
}],
belongsTo: 'Higher'
});
Ext.define("Higher", {
extend: 'Ext.data.Model',
fields: [{
name: 'name',
type: 'string'
}, {
name: 'status',
type: 'int'
}],
hasMany: {
model: 'Deeper',
name: 'deeper'
}
});
after that, I created the following store:
var store = Ext.create('Ext.data.Store', {
model: 'Higher',
autoLoad: true,
proxy: {
type: 'ajax',
url: 'some/correct/url.json',
reader: {
type: 'json',
root: 'name'
}
}
});
My grid shows inline data correctly, so I tried console.debug(store)
The result is:
model: undefined
and
modelDefaults: null
So where did I go wrong?

Sencha Touch: load store for List using Rest Proxy

I'm new to sencha so I'm sure I'm just missing something simple here. I have a rest service and I need to be able to load my store for my list view.
Here's my model with the proxy:
Ext.define('UserModel', {
extend: 'Ext.data.Model',
config: {
fields: [
{ name: 'UserId', type: 'int' },
{ name: 'FullName', type: 'string' }
],
proxy: {
type: 'rest',
url: '/rest/user',
reader: {
type: 'json',
root: 'user'
}
}
}
});
And this code works fine for a GET request. So I know that I'm able to talk with my rest service.
var User = Ext.ModelMgr.getModel('UserModel');
User.load(10058, {
success: function (user) {
console.log("Loaded user: " + user.get('UserId') + ", FullName: " + user.get('FullName'));
}
});
My problem is that I'm unable to load data into my list view when adding the proxy code to the store. How do I pass in a parameter to the rest service and load the store?
Ext.define('UserStore', {
extend: 'Ext.data.Store',
config: {
model: 'UserModel',
proxy: {
type: 'rest',
url: '/rest/user',
reader: {
type: 'json',
root: 'user'
},
autoLoad: true
},
sorters: 'FullName',
grouper: function(record) {
return record.get('FullName')[0];
}
}
});
And here's my list view:
Ext.define('UserView', {
extend: 'Ext.List',
xtype: 'userView',
config: {
scrollable: 'vertical',
loadingText: "Loading your social connections . . .",
indexBar: true,
singleSelect: true,
grouped: true,
cls: 'customGroupListHeader',
itemTpl: '{FullName}',
store: 'UserStore',
onItemDisclosure: true
}
});
Haha! I knew it was something simple. The "autoLoad: true" in the store's proxy needs to be outside of the proxy's brackets.
Ext.define('UserStore', {
extend: 'Ext.data.Store',
config: {
model: 'UserModel',
autoLoad: true,

Categories

Resources