This is my model
Ext.define("StockWatch.model.Market", {
extend: "Ext.data.Model",
config: {
idProperty: 'CompanyCode',
fields: [
{ name: 'CompanyCode', type: 'string' },
{ name: 'LastTradedPrice', type: 'string' },
{ name: 'PercentageDiff', type: 'string' },
{ name: 'FiftyTwoWeekHigh', type: 'string' },
{ name: 'FiftyTwoWeekLow', type: 'string' },
{ name: 'ChangePercent', type: 'string' },
{ name: 'Change', type: 'string' },
{ name: 'MarketCap', type: 'string' },
{ name: 'High', type: 'string' },
{ name: 'Low', type: 'string' },
{ name: 'PrevClose', type: 'string' },
{ name: 'OpenInterest', type: 'string' },
{ name: 'MarketLot', type: 'string' },
{ name: 'ChangeInOpenInterest', type: 'string' },
{ name: 'LastTradedTime', type: 'date', dateFormat: 'c' },
]
}
});
this is my store
Ext.define("StockWatch.store.Markets", {
extend: "Ext.data.Store",
requires: ["Ext.data.proxy.LocalStorage", "Ext.data.proxy.JsonP", "StockWatch.model.Market"],
config: {
model: "StockWatch.model.Market",
autoLoad : true,
proxy : {
type : 'jsonp',
url : 'http://money.rediff.com/money1/current_status_new.php?companylist=17023928%7C17023929&id=1354690151&Rand=0.6305125835351646',
reader:{
type:'json',
rootProperty:''
}
}
}
});
I'm not able to get the data on to my list, may be somewhere fetching of data is wrong.
guide me to find the solution.
also I'm using pull to refresh list plugin, so will the data be loaded automatically each time i pull down the list or do i have to write something over there to??
thnx in advance
EDIT:
I also get this warning in the console
Resource interpreted as Script but transferred with MIME type text/html: "http://money.rediff.com/money1/current_status_new.php?companylist=17023928%7C17023929&id=1354690151&Rand=0.6305125835351646&_dc=1355822361093&page=1&start=0&limit=25&callback=Ext.data.JsonP.callback1".
use callbackKey
callbackKey: Specifies the GET parameter that will be sent to the server containing the function name to be executed when the request completes. Defaults to callback. Thus, a common request will be in the form of url?callback=Ext.data.JsonP.callback1
Defaults to: "callback"
You need to wrap the JSON response in a callback function for JSONP. It doesn't look like your remote call is returning this, try specifying a callback parameter - otherwise if the remote server does not allow this you need to pass it through another server to wrap it in a callback function.
Also, the warning you mentioned in the bottom of your post, don't worry about that. It won't cause any problems.
Related
I have a piece of code in a Sencha Touch v2 controller as shown below. When this code is ran the count after the store.add is (6), the counter after the store.sync is (0) and the store.sync is succeeding.
NOTE: items holds 6 records received from a JsonP proxy, no errors are shown in the console and everything acts as though it was a full success.
requires: [
'Ext.data.proxy.JsonP',
'Ext.data.proxy.Sql'
],
config: {
models: ['Convention'],
stores: ['Conventions']
},
// ***additional code*** //
store.setProxy({
type: 'sql',
database: 'app',
table: 'Conventions'
});
store.removeAll();
store.sync({
success: function(batch){
store.add(items);
console.log("Count before: " + store.getCount()); << Shows (6)
store.sync({
failure: function (batch, options) {
console.log('Convention Sql failure');
},
success: function(batch,options){
console.log("Count after: " + store.getCount()); << Shows (0)
console.log("Convention Sql success");
store.load();
Ext.Viewport.unmask();
}
});
}
});
The model is show here
extend: 'Ext.data.Model',
config: {
idProperty: 'id',
fields: [
{ name: 'id', type: 'string' },
{ name: 'name', type: 'string' },
{ name: 'logoId', type: 'string' },
{ name: 'seasonId', type: 'string'},
{ name: 'viewed', type: 'string'},
{ name: 'dateCreated', type: 'string'},
{ name: 'dateUpdated', type: 'string'}
]
}
and the store is here
extend: 'Ext.data.Store',
requires: [
'Ext.data.proxy.Sql'
],
config: {
model: 'app.model.Convention',
autoLoad: false,
sorters:[{
property: 'name',
direction: 'ASC'
}],
proxy: {
type: 'sql',
database: 'app',
table: 'Conventions'
}
}
After much research it seems that Sencha recently changed some of their code on how they handle IDs. As such, if you are using code examples previous to this change you will get errors when you try to save to the ID field.
Sencha has added the clientIdProperty that you can add to the writer of a proxy and directly to the model.
Reference: http://docs.sencha.com/touch/2.4/2.4.2-apidocs/#!/api/Ext.data.Model-cfg-clientIdProperty
The name of a property that is used for submitting this Model's unique client-side identifier to the server when multiple phantom records are saved as part of the same Operation. In such a case, the server response should include the client id for each record so that the server response data can be used to update the client-side records if necessary. This property cannot have the same name as any of this Model's fields.
As such, my code above will have the following changes to the following where 'siteId' is my id being passed from the Json request and the ID on my server for the record.
model
idProperty: 'id',
clientIdProperty: 'siteId',
identifier: 'uuid',
Controller
store.setProxy({
type: 'sql',
database: 'app',
table: 'Conventions',
writer: {
clientIdProperty: 'siteId'
}
});
I have a list reading from a Json store which contains a grouper on a field of type int. This field is called "req" in the sample model below. However, rather than group by the int value, I would like to assign a text value instead, so for example, in case of "1" I would group by "Yes" and in case of "0" I would group by "No". The conversion can be hard coded as it will not change. Where do I make this conversion in my code? Thanks for your help
Ext.define('MyApp.store.MyStore', {
extend: 'Ext.data.Store',
requires: [
'MyApp.model.MyData'
],
config: {
model: 'MyApp.model.MyData',
storeId: 'MyStore',
proxy: {
type: 'ajax',
url: '/path/to/data.json',
reader: {
type: 'json',
rootProperty: 'items'
}
},
grouper: {
property: 'req',
sortProperty: 'req'
},
groupDir: 'DESC'
}
});
Model:
Ext.define('Mypp.model.MyModel', {
extend: 'Ext.data.Model',
config: {
fields: [
{
name: 'example',
type: 'string'
},
{
name: 'req',
type: 'int'
}
]
}
});
Add to the Model a calculated field with convert() function:
Ext.define('Mypp.model.MyModel', {
extend: 'Ext.data.Model',
config: {
fields: [
{
name: 'example',
type: 'string'
},
{
name: 'req',
type: 'int'
},
{
name: 'reqDisplay',
type: 'string',
convert: function (value, record) {
if (value == null) {
var req = record.get('req');
value = req ? 'Yes' : 'No'
}
return value;
}
}
]
}
});
... and use it instead
grouper: {
property: 'reqDisplay',
sortProperty: 'reqDisplay'
},
Cheers, Oleg
The JSONP proxy is largely working for me, but I need to set properties of a model based on some nested properties in the JSON response. I can't figure how to do this without extending the Reader class, but thought there might be an easier way that I'm just missing.
My Recipe model:
Ext.define('NC.model.Recipe', {
extend: 'Ext.data.Model',
config: {
fields: [
{ name: 'name', type: 'string' },
{ name: 'image', type: 'string' },
{ name: 'preparationText', type: 'string' },
{ name: 'ingredientsText', type: 'string' },
{ name: 'servings', type: 'string' }
]
}
});
My Store:
Ext.define('NC.store.Recipes', {
extend: 'Ext.data.Store',
config: {
model: 'NC.model.Recipe',
storeId: 'Recipes',
proxy: {
type: 'jsonp',
url: 'http://anExternalSite.com/api',
callbackKey: 'callback',
filterParam: 'text',
extraParams: {
type: 'Recipe'
},
reader: {
type: 'json',
idProperty: 'uuid',
}
}
}
});
The JSON format:
[
{
uuid: "/UUID(XXXX)/",
name: "Spicy Peanut Noodle Salad",
image: "http://someplace.com/noodle-salad.jpg",
properties: {
preparationText: "Make it all nice and stuff",
ingredientsText: "Heaps of fresh food",
servings: "serves 4",
}
},
{ ... },
{ ... }
]
I would like those 3 'properties' - preparationText, ingredientsText, and servings, to be placed in the model, but currently only id, name, and image are. What is the method to make this work? If it does involve extending the Reader class, some direction would be great.
Thanks.
You can change your code like this to access nested values
{ name: 'preparationText', type: 'string', mapping: 'properties.preparationText' },
This mapping path should start excluding the root element.
I have defined a model which I want to use twice but with a different url int he proxy (in fact only the id differs) But how can I manage this?
Ext.define('TesterModel', {
extend: 'Ext.data.Model',
autoLoad: false,
fields: [
{ name: 'prename', type: 'string' },
{ name: 'lastname', type: 'string' },
{ name: 'dept', type: 'string' },
{ name: 'rackName', type: 'string' },
{ name: 'rackIP' , vtype:'IPAddress'}],
proxy: {
type: 'ajax',
url: 'php/getData_db.php?id=',
reader: {
type: 'json',
messageProperty: 'message',
root: 'data',
}
},
constructor: function() {
UrlParams=document.URL.split("?");
if(UrlParams.length > 1) {
SingleUrlParams=Ext.Object.fromQueryString(UrlParams[1]);
this.proxy.url = this.proxy.url + SingleUrlParams.right;
console.log(this.proxy.url);
}
return this;
}});
Ext.ModelMgr.getModel('TesterModel').load(0, { // load user with ID of "0"
success: function(tester) {
var rightPanel=Ext.getCmp('rightTester');
rightPanel.loadRecord(tester); // when tester is loaded successfully, load the data into the form
}
});
I thought that the constructor will be done before loading, but nope, it is done after. It's weired to me.
Any hints, please?
(the main URL it's like: .../index.html?left=xx&right=yy )
so I want to fill up a panel on the left with the one id, and a panel on the right window side eith th right id.
Thanks!
Try .getProxy().url = "what/ever.php"
I have the following json :
{"service":
{"description":"Export a list of amendments.","id":"504e1bf57e8d2fdd92b6c316cd000b25","name":"AT4AM_AmendmentsList","notes":"Export a list of amendments in a defined format, Word or XML.\r\n\r\n\"keywords\" : [ \"AT4AM\", \"DST\", \"Amendment\", \"Export\", \"Word\", \"XML\" ]","revision":"2-cd375cfd296ba97e934f12794d4930e9","status":"study","type":"entity",
"versions":[{"description":"v1.0 description...","id":"504e1bf57e8d2fdd92b6c316cd0017c0","version":1}]}}
I would like to display the list of versions into a grid.
here is my model :
Ext.define('XXXX.model.Version', {
extend: 'Ext.data.Model',
fields : [ {
name : 'id',
type : 'string'
}, {
name : 'description',
type : 'string'
}, {
name : 'version',
type : 'string'
}],
belongsTo: 'XXXX.model.Service',
proxy: {
type: 'rest',
id: 'id',
url : 'http://localhost:8080/xxxxx/services/service',
reader: {
type: 'json',
root: 'versions'
}
}
});
Thanks for help
Medley
use root: 'service.versions' in your reader's config.
Here is the solution I found :
1 - I added this to the model 'Service'
{type: 'hasMany', model: 'XXXX.model.Version', name: 'versions'}
2 - I used the configured RestProxy to make a GET request
Ext.ModelManager.getModel('XXXX.model.Service').load(serviceId, {
success: function(service) {
// Now, it is possible to access to all the versions of a service
service.versions().each(function(version) {
listOfVersions.push(version.data);
});
}
});
Regards
Medley