Unable to insert in localstorage - extjs

I have model:
Ext.define('SizoMag.model.SizoBuscetModel', { extend: 'Ext.data.Model',
config: {
fields: [{name: 'text', type: 'string'}, {name: 'price', type: 'string'}],
proxy: {
type: 'localstorage',
id : 'buscetmodel'
}
}
});
and store
Ext.define('SizoMag.store.SizoBuscetStore', {extend: 'Ext.data.Store',
config: {
storeId: 'SizoBuscetStore'
}
});
But when I try to add an entry to the store - get error
[WARN][Ext.data.Operation#setModel] Unless you define your model using metadata, an Operation needs to have a model defined.Console.js:35
[WARN][Ext.data.reader.Reader#process] In order to read record data, a Reader needs to have a Model defined on it. Console.js:35
Uncaught TypeError: object is not a function
I add so
var store=Ext.getStore('SizoBuscetStore');
store.load();store.add({text:'txt',price:'150'});
store.sync();
Please help me/
Tnx

Try this instead, you need to define a model type for a store so it can configure its reader:
Ext.define('SizoMag.store.SizoBuscetStore', {
extend: 'Ext.data.Store',
storeId: 'SizoBuscetStore',
model: 'SizoBuscetModel'
});

Hey its Simple Try this
in Store:
Ext.define('e4b.store.Adult_DOBStore', {
extend: "Ext.data.Store",
config: {
model: "e4b.model.Adult_DOBModel",
autoLoad: true,
clearOnPageLoad: false,
}
});
and Your model will be
Ext.define('e4b.model.Adult_DOBModel', {
extend: 'Ext.data.Model',
config: {
fields: ['Adult1Date'],
proxy: {
type: 'localstorage',
id : 'adultdob'
}
}
});
And Now in your Contoller...
First Get the Value
var A_select1=Ext.getCmp('select1').getValue();
localStorage.setItem("Adult1_select1",A_select1); //Assign the value to localstore
var AdultSalutation={
// object
'Adult1_select1':A_select1,
};
var AdultSalutationstore =Ext.getStore('Adult_AdultSalutationstore');// cal store
AdultSalutationstore.add(AdultSalutation); // add the oject here
AdultSalutationstore.sync();
AdultSalutationstore.load();

Related

ExtJS — How to load store data manually after ajax call?

I rewrite my working Fiddle from ajax proxy type to memory. I'm trying to load memory store data manually:
// app/model/Employees.js file
Ext.define('Fiddle.model.Employees', {
extend: 'Ext.data.Model',
entityName: 'Employees',
fields: [
{
name: 'profile_pic'
},
{
type: 'int',
name: 'age'
},
{
type: 'string',
name: 'last',
mapping: 'name.last'
},
{
type: 'string',
name: 'first',
mapping: 'name.first'
},
{
type: 'string',
name: 'email'
}
],
proxy: {
type: 'memory',
reader: {
type: 'json',
rootProperty: 'items',
totalProperty: 'total',
successProperty: ''
}
}
});
// app/store/Employees.js file
Ext.define('Fiddle.store.Employees', {
extend: 'Ext.data.Store',
pageSize: 30, // items per page
alias: 'store.employees',
model: 'Fiddle.model.Employees',
});
//app.js fule - launch() function
var store = Ext.create('Fiddle.store.Employees');
console.log(store);
Ext.Ajax.request({
url: 'mates.json',
success: function(resp) {
var result = resp.responseText;
console.log(result);
// store.loadRawData(result);
store.loadData(result);
console.log(store);
console.log(store.getAt(0));
},
});
As result I have 3386 records in store, every symbol in my json file. And what I see in console as first record:
What I'm doing wrong?
And where I need to put proxy lines - in model or in store?
responseText is a string, which contains the serialized JSON data. You have to deserialize it into an object before you can use loadRawData to load the object through the model converters into the store:
var result = Ext.decode(resp.responseText);
store.loadRawData(result);
loadData and loadRawData differ in that loadData does not call the converters on the model. loadRawData is equivalent to what the ajax proxy does, loadData is not.
Did it in this way:
//in Grid panel js file
listeners: {
afterrender: function(grid, evt) {
var myStore = grid.getStore();
Ext.Ajax.request({
url: 'mates.json',
success: function(resp) {
var result = Ext.decode(resp.responseText);
myStore.getProxy().data = result;
myStore.load();
},
});
}
}
In store autoLoad: true must be disabled. This way of loading instead of store.loadRawData(result); shows the correct number of records in the pagingtoolbar.

Get store data items value in sencha ext js

I have this data in a JSON file.
{
data: [
{
lari: 1.75
}
]
}
I want get this lari's value e.g.:
var lari = mystore.data.items[0];
I'm using this code:
Ext.define('Currency.store.mystore',
{ extend: 'Ext.data.Store', requires:
[ 'Currency.model.MyModel', 'Ext.data.proxy.Ajax', 'Ext.data.reader.Json' ],
constructor: function(cfg) {
var me = this;
cfg = cfg || {};
me.callParent([Ext.apply({
model: 'Currency.model.MyModel', storeId: 'mystore',
proxy: { type: 'ajax', url: 'data.json',
reader: { type: 'json', root: 'data'
...
Ext.encode(Ext.pluck(mystore.data.items[0], 'data'));
but I have an error:
Uncaught ReferenceError: mystore is not defined
userclassname: 'mystore',
Please help me. How to write this code?
Define the storeId of your store:
Ext.define('Currency.store.mystore', {
extend: 'Ext.data.Store',
storeId: 'mystore',
// ...
And find the first element:
var lari = Ext.getStore("mystore").getAt(0);

Store cannot read xml from external source but can do it when reading from local source

I need to read content from a data source which is located on a remote server(I do not have access to modify anything)
I have tried days to get the content , but doesn't work.
What then I did was I downloaded this data source which is a xml file and put it under same folder with my code to test the correctness of my code syntax and found that the code works.
But when I changed back to the external data resource(
from: url: 'app/store/configuration.xml'
to : url: 'http://webtrak.bksv.com/mel/configuration'
), it still reads but returns no content.
This is not caused by CORS issue as I am testing my app on real devices.
Here are my store and model. Please help
Ext.define('myApp.store.SensorStationStore', {
extend: 'Ext.data.Store',
requires: ['myApp.model.SensorStation', 'Ext.data.reader.Xml'],
config:{
model: 'myApp.model.SensorStation',
storeId: 'SensorStore',
autoLoad: true,
proxy: {
type: 'ajax',
url: 'http://webtrak.bksv.com/mel/configuration',
//url: 'app/store/configuration.xml',
reader: {
type: 'xml',
record: 'locations',
rootProperty: 'nmts'
}
}
}
});
Ext.define('myApp.model.SensorStation', {
extend: 'Ext.data.Model',
config: {
fields: [
{
name: 'name',
type: 'string',
mapping: '#name'
//convert: function (value, record) {
// Ext.Msg.alert(value,record.raw);
// //var nodes = rec.raw.querySelectorAll('');
//}
},
{
name: 'lat',
mapping: '#latitude',
type: 'float'
},
{
name: 'lng',
mapping: '#longitude',
type: 'float'
},
{
name: 'locid',
mapping:'#locid',
type: 'string'
}
]
}
});
Thank you.
I figured out what's the problem is... I have never worked with XML so,I don't know how the response of ajax request look like ,but by applying following code for store will fill your app's store(just a little change in your code)
Code:
Ext.define('myApp.store.SensorStationStore', {
extend: 'Ext.data.Store',
requires: ['myApp.model.SensorStation', 'Ext.data.reader.Xml'],
config:{
model: 'myApp.model.SensorStation',
storeId: 'SensorStore',
autoLoad: true,
proxy: {
type: 'ajax',
url: 'http://webtrak.bksv.com/mel/configuration',
//url: 'app/store/configuration.xml',
reader: {
type: 'xml',
record: 'locations',
rootProperty: 'nmts'
}
}
} });
You are trying to apply store configs outside of config object. Cheers!!

Accessing a store from another store - Sencha Touch

I'm trying to create a store and inside access the data from another store to construct the proxy url.
Something like this:
Ext.define('MyApp.store.Post',{
extend:'Ext.data.Store',
config: {
model: 'MyApp.model.Post',
proxy: {
type: 'ajax',
url: 'http://mywebsite.com/get?userid=' + Ext.getStore('UserData').getAt(0).data.userid,
reader: {
type: 'json'
}
}
}
});
So, I'm basically trying to get the userid from another store to be able to construct the correct url.
This doesn't work, I get:
Uncaught TypeError: Object #<Object> has no method 'getStore'
What is the correct way to do this?
EDIT: Okay I put in a dummy URL and trying to change it with a listener, this is my store now:
Ext.define('MyApp.store.Post',{ extend:'Ext.data.Store',
config: {
fields: [
'title', 'link', 'author', 'contentSnippet', 'content'
],
proxy: {
type: 'jsonp',
url: 'https://ajax.googleapis.com/ajax/services/feed/load?v=1.0&q=http://feeds.feedburner.com/SenchaBlog',
reader: {
type: 'json',
rootProperty: 'responseData.feed.entries'
}
},
listeners: [
{
beforeload: function(){
console.log("store loaded"); //I DON'T SEE THIS IN CONSOLE
return true;
}
}
]
},
});
Basically you did nothing wrong, but the reason is sencha touch uses asynchronous loading and it seems that Ext.getStore() is not instantiated at the time your store is defined.
Let's try this method instead:
First, add a listener for beforeload event inside your store config:
Ext.define('MyApp.store.Post',{
extend:'Ext.data.Store',
config: {
model: 'MyApp.model.Post',
proxy: {
type: 'ajax',
//url: you don't even need to set url config here, simply ignore it
reader: {
type: 'json'
}
}
},
listeners: [
{
fn: 'setUrl',
event: 'beforeload'
}
]
});
then declare a function like this, in the same file:
setUrl: function(){
this.getProxy().setUrl(Ext.getStore('UserData').getAt(0).data.userid);
return true;
}
This way, it's ensured to set the url for your store's proxy right before it's loaded. And basically at the time, all core methods are instantiated.
Update: please try this with your Post store:
Ext.define('MyApp.store.Post',{
extend:'Ext.data.Store',
config: {
//autoLoad: true,
fields: ['title', 'link', 'author', 'contentSnippet', 'content'],
proxy: {
type: 'jsonp',
url: 'dummy url',
reader: {
type: 'json',
rootProperty: 'responseData.feed.entries'
}
},
},
initialize: function(){
console.log("loaded!");
this.getProxy().setUrl('https://ajax.googleapis.com/ajax/services/feed/load?v=1.0&q=http://feeds.feedburner.com/SenchaBlog');
//return true;
}
});
After reading the source code of the pull-to-refresh plugin, I see that Sencha Touch use an Ext.data.Operation instead of Ext.data.Store.load() function. So you will have to put it into the initialize method instead.
Use Ext.data.StoreManager.lookup('UserData') to get the store instance.
But in your case, I would use this somewhere, where you work with the userid:
var postsStoreInstance = ...;
postsStoreInstancegetProxy()._extraParams.userid = userid;
It adds a query paremetry to the store's proxy url
The way you do it is the correct way. What is the code of your store definition?
Make sure your store has storeId: 'UserData'.
See this working example:
Ext.define('User', {
extend: 'Ext.data.Model',
fields: [
{name: 'id'}
]
});
Ext.create( 'Ext.data.Store', {
model: 'User',
storeId: 'UserData'
});
Ext.define('MyApp.store.Post',{
extend:'Ext.data.Store',
config: {
model: 'MyApp.model.Post',
proxy: {
type: 'ajax',
url: 'http://mywebsite.com/get?userid=' + Ext.getStore('UserData'),
reader: {
type: 'json'
}
}
}
});

Declaring model with belongsTo not generating getter

Based on some examples of Ext.data.Model with associations I wrote the following class:
Ext.define('MyApp.model.Children',{
extend: 'Ext.data.Model',
fields : [{
name: 'parent' //object of the belongsTo
},{
name: 'description',
type: 'string'
}],
belongsTo : [{
name: 'parent',
foreignKey: 'parent', //also tried parent.id
instanceName: 'parent',
getterName: 'getParent',
model: 'MyApp.model.Parent'
}],
proxy : {
type: 'rest',
url: '../rest/children',
reader : {
type: 'json',
root: 'data'
}
}
});
Shouldn't this definition generate a getChildren method? The MyApp.model.Parent also have a proxy defined.
I'm testing with:
var store = Ext.create('Ext.data.Store',{
model: 'MyApp.model.Children'
});
store.load(function(recs){
console.log(recs[0].getParent); //prints undefined instead of function
});
It looks like your parent model isn't loaded. Try adding the requires configuration to your child model.
Ext.define('MyApp.model.Children', {
extend: 'Ext.data.Model',
//ensures the Parent model is loaded first
requires: 'MyApp.model.Parent',
fields: ...

Resources