I'm facing some diffculties loading specific data records frome local store into app's views.
The store looks like this:
Ext.define('xyz.store.UserDataStore', { extend: 'Ext.data.Store',
requires: [ 'xyz.model.user' ],
config: {
autoLoad: true,
autoSync: true,
model: 'xyz.model.user',
storeId: 'myStore',
proxy: { type: 'localstorage', id: 'id' } } });
The model looks like this:
Ext.define('xyz.model.user', { extend: 'Ext.data.Model',
config: { fields: [ { name: 'token', type: 'string' }, { name: 'title' }, { name: 'login' }, { name: 'facebookId' }, { name: 'firstName', type: 'string' }, { name: 'lastName', type: 'string' }, { name: 'nationality', type: 'string' }, { name: 'birthDay', type: 'string' }, { name: 'phone' }, { name: 'mobile' }, { name: 'street' }, { name: 'city', type: 'string' }, { name: 'zipCode', type: 'int' }, { name: 'willingToTravel' }, { name: 'pictureUrl' }, { name: 'eMail' }, { name: 'publicList' } ] } });
Thank you in advance,
Sabine
Related
I am using ExtJS 6.x with three models:
Ext.define('Admin.model.Patient', {
extend: 'Ext.data.Model',
requires: [
'Ext.data.proxy.Rest',
'Ext.data.schema.Association'
],
fields: [
{ name: 'id', type: 'string' },
{ name: 'mrn', type: 'string' },
{ name: 'birth_date', type: 'date', format: 'Y-m-d' },
{ name: 'sex', type: 'string' },
{ name: 'first_name', type: 'string' },
{ name: 'last_name', type: 'string' },
],
style: {
'font-size': '22px',
'color':'red'
},
proxy: {
type: 'ajax',
url: remote.url.patient,
reader: {
type: 'json',
rootProperty: ''
}
}
});
Ext.define('Admin.model.LabResultGroup', {
extend: 'Ext.data.Model',
idProperty: 'id',
fields: [
{ name: 'test_code', type: 'string' },
{ name: 'test_name', type: 'string' },
{
name: 'patient_id',
type: 'string',
reference: {
parent: 'Patient',
inverse: 'lab_results',
autoLoad: false
}
}
],
proxy: {
type: 'ajax',
url: remote.url.labsgroup,
reader: {
type: 'json',
rootProperty: ''
}
});
and
Ext.define('Admin.model.LabResult', {
extend: 'Ext.data.Model',
idProperty: 'id',
fields: [
{ name: 'test_code', type: 'string' },
{ name: 'test_name', type: 'string' },
{ name: 'test_code_system', type: 'string' },
{ name: 'result_value', type: 'string' },
{ name: 'result_value_num', type: 'string' },
{ name: 'collection_datetime', type: 'date', format: 'Y-m-d' },
{ name: 'result_datetime', type: 'date', format: 'Y-m-d' },
{
name: 'lab_id',
type: 'string',
reference: {
parent: 'LabResultGroup',
inverse: 'lab_group',
autoLoad: false
}
}
],
proxy: {
type: 'ajax',
url: remote.url.labs,
reader: {
type: 'json',
rootProperty: ''
}
}
});
I can access the association between LabResultGroup and Patient just fine (between two comboboxes using bindings), but when I try accessing the association between LabResult and LabResultGroup, it does not register.
I will post a Fiddle in due course to exhibit the behavior I am encountering. Is there anything that would prevent associations across models like this?
It actually worked! For some odd reason the parent name in the association on my LabResult model got mucked up. Corrected that, and my association bindings are firing as expected.
(Also, there was a minor problem with the API endpoint I was accessing. I had to add another condition for the property on which it was filtering. Details, shmetails)
Moral of the story: Names are important! Happy Friday peeps! Ha! Ha!
My user has many exams.
User:
Ext.define('Tm.model.User', {
extend: 'Ext.data.Model',
config: {
hasMany: { model: 'Tm.model.Exam', name: 'exams' },
fields: [
{ name: 'id', type: 'int' },
{ name: 'username', type: 'string' },
{ name: 'email', type: 'string' },
{ name: 'nameFirst', type: 'string' },
{ name: 'nameLast', type: 'string' }
],
...
}
});
Exam:
Ext.define('Tm.model.Exam', {
extend: 'Ext.data.Model',
config: {
belongsTo: 'Tm.model.User',
fields: [
{ name: 'id', type: 'int', defaultValue: null },
{ name: 'title', type: 'string', defaultValue: 'Exam' }
],
...
}
});
Calling var exams = user.exams(); gives me: Uncaught TypeError: Object [object Object] has no method 'exams'
You must require your associated model for the getter to be generated.
So add this to the definition of Tm.model.User:
requires: ['Tm.model.Exam']
I am usning below code to store the data from the ajax request but it is not lading data on the store so Please let me know what I am doing wrong.
Here is my store class:
Ext.define("Por.store.Notes", {
extend: "Ext.data.Store",
config: {
storeId: 'Notes',
model: "Por.model.Note",
}
});
This is my model class:
Ext.define("Por.model.Note", {
extend: "Ext.data.Model",
config: {
idProperty: 'id',
fields: [
{ name: 'id', type: 'string' },
{ name: 'content_name', type: 'string' },
{ name: 'kind', type: 'string' },
{ name: 'company_name', type: 'string' },
{ name: 'note', type: 'string' },
{ name: 'attext', type: 'string' },
{ name: 'cid', type: 'string' },
{ name: 'category', type: 'string' },
{ name: 'file_extension', type: 'string' },
{ name: 'mime_image', type: 'string' },
{ name: 'ciid', type: 'string' },
{ name: 'citem_name', type: 'string' },
{ name: 'attach', type: 'string' },
{ name: 'cryptic', type: 'string' },
{ name: 'url', type: 'string' },
{ name: 'is_socialsites_share_ok', type: 'string' },
{ name: 'skey', type: 'string' },
{ name: 'lookup_id', type: 'string' },
{ name: 'lookup_kind_name', type: 'string' },
{ name: 'rid', type: 'string' },
{ name: 'content', type: 'string' },
{ name: 'clip_wm', type: 'string' },
{ name: 'vid_wm', type: 'string' },
{ name: 'flash_clip', type: 'string' },
{ name: 'module_num', type: 'string' },
{ name: 'itemtype', type: 'string' }
],
}
});
This is ajax request which I am firing :
Ext.Ajax.request({
url: url,
scope: this,
callback: callbackFn
success: function(response) {
var responseData = Ext.JSON.decode(response.responseText);
var store = Ext.getStore('Notes');
store.setData(responseData);
store.sync();
},
failure:function(response){
alert(response.status);
}
});
This is my view:
Ext.define("Por.view.NotesListContainer", {
extend: "Ext.Container",
alias: "widget.noteslistcontainer",
initialize: function () {
this.callParent(arguments);
var notesTitle = {
xtype: 'panel',
html:'<div style = " text-align:center; padding-top:10px;" >First Data</div>'
};
var notesData = {
xtype: 'panel',
html:'<div style = " padding-left:15px;">Personalized Content for ARP</div>'
};
This is my list view:
var notesList = {
xtype: "noteslist",
store: Ext.getStore("Notes"),
listeners: {
itemtap: { fn: this.onNotesListDisclose, scope: this }
}
};
this.add([notesTitle,notesData, notesList]);
},
onNewButtonTap: function () {
console.log("newNoteCommand");
this.fireEvent("newNoteCommand", this);
},
onNotesListDisclose: function(dv, index, item, record) {
console.log("editNoteCommand");
this.fireEvent('editNoteCommand', this, record);
},
config: {
layout: {
type: 'vbox'
}
}
});
Ext.define("Por.view.NotesList", {
extend: "Ext.dataview.List",
alias: "widget.noteslist",
config: {
loadingText: "Loading Notes...",
emptyText: "<div class=\"notes-list-empty-text\">No notes found.</div>",
onItemTap: true,
itemTpl:'<div ><div style="font-size:14px;color: #5090D0;font-weight:bold;">{content_name}</div><div style =
"clear:both;"></div></div><div><p style="font-size:12px;"> <span style="font-weight:bold;font-size:14px;"><b>Type: </b></span> {company_name}
</p></div><div><p style="font-size:12px;"><span style="font-weight:bold;font-size:14px;border:1px solid red;">Account: </span>
{lookup_kind_name} </p></div></div>'
}
});
Here is the json data:
{
"data": [{
"id": "56636",
"content_name": "Ray Zor interview",
"kind": "0",
"company_name": "The Gillette Company",
"note": "<b>Business Problem<\/b> d\r\n* Inadequate collaboration infrastructure\r\n* 100% year over year growth\r\n* Lost sales due to service issues \r\n\r\n<b>Solution<\/b>\r\n* Apollo suite v7 with Oracle add-in\r\n* AppAccelerator for SQL\r\n* Solution Consulting engagement\r\n\r\n<b>Results<\/b>\r\n* 30% in time to market process\r\n* 25% improvement in customer sat scores\r\n* Better utilization of existing IT staff",
"attext": null,
"cid": null,
"category": "Listen",
"file_extension": "rref",
"mime_image": null,
"ciid": null,
"citem_name": null,
"attach": null,
"cryptic": "48737f98c5172",
"url": null,
"is_socialsites_share_ok": null,
"skey": null,
"lookup_id": "-1",
"lookup_kind_name": "Recorded Audio Reference",
"rid": "56636",
"content": "a wma is loaded to this topic",
"clip_wm": "48738147342c1.wma",
"vid_wm": "",
"flash_clip": "",
"module_num": 0,
"itemtype": "listen"
}]
}
Either put autoLoad: true in the store
OR
store.load({
callback: function(records, operation, success) {
// the operation object contains all of the details of the load operation
console.log(records);
},
scope: this
});
You have not defined proxy and reader for Por.store.Notes. Define these configurations like -
Ext.define("Por.store.Notes", {
extend: "Ext.data.Store",
config: {
storeId: 'Notes',
model: "Por.model.Note",
proxy: {
type: "ajax",
url : url,
reader: {
type: "json",
rootProperty: "data"
}
}
}
});
I have problems to make an 1 to many model with Sencha Touch 2.
I want to save "persons" and add "todo's" to persons.
These values should be saved at the local storage.
So 1 person can have many todo's.
For this I have 2 models and 2 stores.
Personmodel:
Ext.define("app.model.PersonModel", {
extend: "Ext.data.Model",
config: {
idProperty: 'email',
fields: [
{ name: 'name', type: 'string' },
{ name: 'email', type: 'string' },
],
validations: [
{ type: 'presence', field: 'email' , message: 'Blabla'},
{ type: 'presence', field: 'name' , message: 'Blabla'},
{ type: 'email', field: 'email' , message: 'Blabla'},
]
}
});
TodoModel:
Ext.define("app.model.TodoModel", {
extend: 'Ext.data.Model',
config: {
idProperty: 'todoId',
fields: [
{ name: 'todoId', type: 'int' },
{ name: 'email', type: 'string' },
{ name: 'note', type: 'string' }
],
validations: [
{ type: 'presence', field: 'todoId', message: 'Blabla' },
{ type: 'presence', field: 'email', message: 'Blabla' },
{ type: 'presence', field: 'note', message: 'Blabla' }
]
}
});
PersonStore:
Ext.define("app.store.PersonStore", {
extend: "Ext.data.Store",
requires: "Ext.data.proxy.LocalStorage",
config: {
model: "app.model.PersonModel",
proxy: {
type: 'localstorage',
id: 'todo-app-personstore'
},
sorters: [{ property: 'name', direction: 'ASC'}],
grouper: {
sortProperty: "name",
direction: "ASC",
groupFn: function (record) {
}
}
}
});
TodoStore:
Ext.define("app.store.TodoStore", {
extend: "Ext.data.Store",
requires: "Ext.data.proxy.LocalStorage",
config: {
model: "app.model.TodoModel",
proxy: {
type: 'localstorage',
id: 'todo-app-todostore'
},
sorters: [{ property: 'email', direction: 'ASC'}],
grouper: {
sortProperty: "email",
direction: "ASC",
groupFn: function (record) {
}
}
}
});
I deleted the associations I made in the models because they didn't work at all.
Maybe relevant information: First I want to save a person. Later on I want to save todo's and connect them to a person.
Try Referring below links may helpful to you
http://miamicoder.com/2012/sencha-touch-2-models-hasmany-associations-php-example/
http://appointsolutions.com/2012/07/using-model-associations-in-sencha-touch-2-and-ext-js-4/
I have my model as this:
Ext.define("NotesApp.model.Note", {
extend: "Ext.data.Model",
config: {
idProperty: 'id',
fields: [
{ name: 'id', type: 'int' },
{ name: 'dateCreated', type: 'date', dateFormat: 'c' },
{ name: 'question', type: 'string' },
{ name: 'answer', type: 'string' },
{ name: 'type', type: 'int'},
{ name: 'author', type: 'int'}
],
validations: [
{ type: 'presence', field: 'id' },
{ type: 'presence', field: 'dateCreated' },
{ type: 'presence', field: 'question', message: 'Please enter a question for this card.' }
]
}
});
and my server page (qa.php) outputs this:
{"results":[{"id":"1","dateCreated":"2012-05-01","question":"asdf?","answer":"fdsa","type":"0","author":"0"},{"id":"2","dateCreated":"2012-05-01","question":"qwer?","answer":"rewq","type":"0","author":"0"}]}
and this is my code in the store:
Ext.define("NotesApp.store.Online", {
extend: "Ext.data.Store",
config: {
model: 'NotesApp.model.Note',
storeId: 'Online',
proxy: {
type: 'jsonp',
url: 'http://xxxxxxxx.com/qa.php',
reader: {
type: 'json',
rootProperty: 'results'
}
},
autoLoad: false,
listeners: {
load: function() {
console.log("updating");
Ext.getStore('Notes').getProxy().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: 'dateCreated'
},
{
name: 'question'
},
{
name: 'answer'
},
{
name: 'type'
},
{
name: 'author'
}
]
}
});
But when I called Ext.getStore('Online').load(), the console showed "updating", "updating1", and "updating3" but not any "updating2", ie. no records were found. I wonder where the mistake is? Is there a way to output the jsonstring that's read in?
This is a different scope
listeners: {
load: function() {
console.log("updating");
Ext.getStore('Notes').getProxy().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");
},
this//adds scope
or
listeners: {
load: function(store,record,options) {
console.log("updating");
Ext.getStore('Notes').getProxy().clear();
console.log("updating1");
// Loop through records and fill the offline store
store.each(function(record) {
console.log("record"); //wahei records!
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");
}