How can i fetch a record using belongs to association ?
var Category = Ext.regModel('Category', {
fields: [
{name: 'id', type: 'int'},
{name: 'name', type: 'string'}
]
});
var Product = Ext.regModel('Product', {
fields: [
{name: 'id', type: 'int'},
{name: 'category_id', type: 'int'},
{name: 'name', type: 'string'}
],
associations: [
{type: 'belongsTo', model: 'Category'}
]
});
Amol,
I speak only of ExtJS 4, so if you can relate this to ExtJS 3 then great, but you would retrieve multiple records via a store:
As a starting point though you could do
var records = Ext.StoreManager.lookupStore("productStore").load({
belongTo: 'books',
callback: function(records) {
Ext.each(records,function(record) {
console.log(JSON.stringify(record.raw))
});
}
});
Depending on the proxy setup on the productStore, this will append belongTo to the querystring so if reader proxy has url: /products and the extra params belongTo is sent this will hit the server with /products?belongTo=books
Related
I have the model:
Ext.define('EvaluateIt.model.Address', {
extend: 'Ext.data.Model',
config: {
idProperty: 'id',
fields: [
{name: 'address', type: 'string'},
{name: 'city', type: 'string'},
{name: 'state', type: 'string'},
{name: 'zipcode', type: 'string'},
{name: 'county', type: 'string'}
],
proxy: {
type: "sql",
database: 'Test'
}
}
});
In my controller, I insert data into this model as follows:
var address = Ext.create('EvaluateIt.model.Address', {
address: json[i].garden.address.address
});
address.save();
Where the json array is grabbed via Ajax and thus inserted into the model without any problems.
However, when I try to access the id from the model like,
console.log('address.id ' + address.id);
I get something of the form ext-record-n (where n does not even map to the id in my Address table). How can I reference the actual value of the id column in this table? I tried this, but was unsuccessful: https://github.com/tomalex0/SenchaTouch-v2-SqliteProxy/issues/3
Adding the id field to the fields array will cause the proxy to create the database table with column id as an AUTOINCREMENT field.
Ext.define('EvaluateIt.model.Address', {
extend: 'Ext.data.Model',
config: {
idProperty: 'id',
fields: [
{name: 'id', type: 'int'},
{name: 'address', type: 'string'},
{name: 'city', type: 'string'},
{name: 'state', type: 'string'},
{name: 'zipcode', type: 'string'},
{name: 'county', type: 'string'}
],
proxy: {
type: "sql",
database: 'Test'
}
}
});
The proxy will read the id value created by the database. You can access the value by passing a callback function to the model save method.
var address = Ext.create('EvaluateIt.model.Address', {
address: json[i].garden.address.address
});
address.save(function(record) {
console.log('address.id ' + record.getId();
}, this);
Ext.define('record.SecurityCase', {
extend : 'Ext.data.Model',
fields : [{
name : 'id',
type : 'string',
persist : false
}, {
name : 'takeplaceTime',
type : 'date',
persist : true
}, {
name : 'brief',
type : 'string',
persist : true
}],
groupField: 'takeplaceTime'
});
A grid with store used model above.And I want it to be grouped with 'takeplaceTime'.for example:
obj.takeplaceTime='2013-10-01';obj2.takeplaceTime='2013-04-01';obj3.takeplaceTime='2013-12-01';obj4.takeplaceTime='2012-12-01';
obj;obj2;obj3 are one group as its year is 2013. obj4 will be another ,year 2012.
Is there a groupRenderFunction to handle this?
You can define calculated property in Model for grouping. Example:
Ext.define('Model1', {
extend: 'Ext.data.Model',
fields: [
{name: 'name', type: 'string'},
{name: 'seniority', type: 'string'},
{name: 'department', type: 'string'},
{name: 'group', type: 'string', convert: function(value, record) {
return record.get('name').substr(0, 1); // first letter of name
} }
]
});
Working sample in Ext JS 4.2: http://jsfiddle.net/BmVeg/1/
Using Ext JS 4.1....
I have a grid that displays a bunch of Model instances, although only some of the fields are displayed. I then have a double-click listener where I would like to load the entire record into a form for editing. In the double-click listener I do not see the data in my hasMany association although the json data is being returned according to Firebug's Net display where I see the response from the server call. Is there something wrong with my model or am I going about this wrong?
Request.js
Ext.define('Request', {
extend: 'Ext.data.Model',
requires: ['PointOfContact'],
fields: [
{name: 'id', type: 'int'},
{name: 'project', type: 'string'},
{name: 'purpose', type: 'string'},
{name: 'status'},
{name: 'additionalInfo', type: 'string'}
],
hasMany: [{
model: 'PointOfContact',
name: 'pointOfContacts',
foreignKey: 'id',
associationKey: 'pointOfContacts'
}],
proxy: {
type: 'rest',
url: '/web/project/rest/request/',
reader: { type: 'json' },
writer: { type: 'json' }
}
});
PointOfContact.js
Ext.define('PointOfContact', {
extend: 'Ext.data.Model',
fields: [
{name: 'id', type: 'int'},
{name: 'fullName', type: 'string'},
{name: 'email', type: 'string'},
{name: 'phone', type: 'string'}
]
});
Requests.js
Ext.define('Requests', {
extend: 'Ext.data.Store',
model: 'Request',
autoLoad: true
});
RequestsView.js
Ext.define('RequestsView', {
extend: 'Ext.grid.Panel',
title: 'All Requests',
store: 'Requests',
viewConfig: {
singleSelect: 'true',
listeners: {
itemdblclick: function(dataview, record, item, index, e) {
console.log(record.get('project'));
console.log(record.get('purpose'));
console.log(record.get('status'));
console.log(record.get('additionalInfo'));
console.log(record.get('pointOfContacts'));
var comp = Ext.ComponentQuery.query('requestForm');
comp[0].getForm().loadRecord(record);
var mainPanel = Ext.ComponentQuery.query('mainpanel');
mainPanel[0].getLayout().setActiveItem('requestForm');
}
}
},
columns: [
{header: 'Project', dataIndex: 'project', flex: 1},
{header: 'Purpose', dataIndex: 'purpose', flex: 1},
{header: 'Status', dataIndex: 'status', flex: 1}
]
});
So in the console I see the values for project, purpose, status and additionalInfo but I get "undefined" for pointOfContacts.
Any suggestions?
UPDATE WITH FINAL WORKING CODE:
Here is the working code I used to retrieve the pointofContacts and load a grid on my form panel with the pointOfContacts
...
itemdblclick: function(dataview, record, item, e) {
var comp = Ext.ComponentQuery.query('requestForm');
comp[0].getForm().loadRecord(record);
Ext.getCmp('pocGrid').reconfigure(record.pointOfContacts());
var mainPanel = Ext.ComponentQuery.query('mainpanel');
mainPanel[0].getLayout().setActiveItem('requestForm');
}
....
Has many associations are not parsed in to associated records by default. Especially for the grid - as that is supposed to be a flat data view. Model docs show you how to setup associations but don't say anything about creating instances for you :)
There are links to usage of has many (http://docs.sencha.com/ext-js/4-1/#!/api/Ext.data.association.HasMany) from the Model docs. Unfortunately the usage is not what you expect it to be. Essentially it is designed to fetch the records on demand by calling their store to load.
I just downloaded the final version of ExtJs 4 and I'm trying to implement some things using new Model approach.
For instance I have a model named SetupModel, it has 2 nested models Users, Reports.
I create new store and I set the Model property of the store = SetupModel.
The question is - how can I access my nested properties after data was loaded into the store?
I need something like myStore.data.Users(), but is incorrect.
Any thoughts?
When you define your model, you need to provide the necessary association with the nested models. Since, you have not provided your code. Here is an example:
My Product Model:
Product = Ext.define('Product',{
extend: 'Ext.data.Model',
fields: [
{name: 'id', type: 'int'},
{name: 'user_id', type: 'int'},
{name: 'name', type: 'string'},
{name: 'price', type: 'float'}
],
proxy: {
type: 'localstorage',
id: 'products'
}
});
My User Model:
User = Ext.define('User',{
extend: 'Ext.data.Model',
fields: [
{name: 'id', type: 'int'},
{name: 'name', type: 'string'},
{name: 'gender', type: 'string'},
{name: 'username', type: 'string'}
],
associations: [
{type: 'hasMany', model: 'Product', name: 'products'}
],
proxy: {
type: 'localstorage',
id : 'users'
}
});
Now, if you have a instance of User model with products. Here is how you can access the products:
var productStore = user.products();
Note that user.products() returns a Ext.data.Store. Now, you can traverse or filter or find your product record. Here is how I got my first product's name:
productStore.getAt(0).get('name');
I'm creating a data store that will load the data from server. I'm wondering how I can pass parameters to the proxy.
var dataStore = new Ext.data.JsonStore({
proxy:'productSearch.php',
root:'products',
fields:['title', 'image', 'inStock', 'price', 'category', 'manufacturer']
});
I usually do it like this
var dataStore = new Ext.data.JsonStore({
url: 'productSearch.php'
root: 'products',
baseParams: { //here you can define params you want to be sent on each request from this store
param1: 'value1',
param2: 'value2'
},
fields: [...]
});
dataStore.load({
params: { //here you can define params on 'per request' basis
param3: 'value3'
}
});
I also prefer to define fields like this:
fields: [
{name: 'title', mapping: 'title', type: 'string'},
{name: 'image', mapping: 'image', type: 'string'},
{name: 'inStock', mapping: 'inStock', type: 'bool'},
{name: 'price', mapping: 'price', type: 'float'},
{name: 'category', mapping: 'category', type: 'int'},
{name: 'someDate', mapping: 'someDate', type: 'date', dateFormat: 'Y-m-d'},
]
Two things here:
I assign the types, so that the store is loaded with correct datatypes. It will even convert string dates to JavaScript Date() objects.
I use 'mapping' parameter, to tell which fields from JSON are to be matched to which fields in the store. If for whatever reason JSON format changes, I only need to make one change here.