[EXT JS]「hasMany」asociation on ExtJS 4.1.1 a
12720 ワード
ExtJS uses「ハスMany」assiociation to support neted json.
However the sencha docs lacks well organized documents to guide how to use it.The coder has to test a lot to make their model work.
The re is a post which pointed some extra“rules”to make the hasManwork.
http://extjs-tutorials.blogspot.co.uk/2012/05/extjs-hasmany-relationships-rules.html
In my case,I used Extjs 4.1.1 a,after referencing a lot and testing a lot.I got my codes working.
I used hasMantwice,one for reading ness ted json from existing json file;one for loading json docs from mongodb database.
Model is defined in「model」folder in MVC architecture.
(1)Loading from mongo DB database
To read from database,we still need to write the webservice which connects the database and gives API to web client.I used Node.js here.
As pointed in Extjs proxy(see「App.model.Item Price」)、The web service is「ret」、to write this I used「express」module.To implement reading from MongoDB I used「Mongoose」module.
(2)Loading from file
However the sencha docs lacks well organized documents to guide how to use it.The coder has to test a lot to make their model work.
The re is a post which pointed some extra“rules”to make the hasManwork.
http://extjs-tutorials.blogspot.co.uk/2012/05/extjs-hasmany-relationships-rules.html
In my case,I used Extjs 4.1.1 a,after referencing a lot and testing a lot.I got my codes working.
I used hasMantwice,one for reading ness ted json from existing json file;one for loading json docs from mongodb database.
Model is defined in「model」folder in MVC architecture.
(1)Loading from mongo DB database
Ext.define('App.model.ItemPrice', {
extend : 'Ext.data.Model',
idProperty : '_id',
fields : [{
name : '_id',
type : 'string'
}, {
name : 'Category',
type : 'string'
}, {
name : 'SE',
type : 'string'
}, {
name : 'Version',
type : 'string'
}, {
name : 'Unit',
type : 'string'
}, {
name : 'Partname',
type : 'string'
}, {
name : 'OTC',
type : 'Number'
}, {
name : 'MC',
type : 'Number'
}, {
name : 'Currency',
type : 'string'
}],
hasMany : {
name : 'Attributes',
model : 'App.model.ItemAttribute',
associationKey : 'Attributes'
},
proxy : {
type : 'rest',
url : '/itemprices',
reader : {
type : 'json',
root : 'prices',
successProperty : 'success'
},
writer : Ext.create('Ext.data.writer.DeepJson')
}
});Ext.define('App.model.ItemAttribute', {
extend : 'Ext.data.Model',
fields : [{
name : 'FieldKey',
type : 'string'
}, {
name : 'FieldValue',
type : 'string'
}]
});Ext.define('App.store.ItemPrices', {
extend: 'Ext.data.Store',
autoLoad: false,
autoSync: false,
model: 'App.model.ItemPrice'
});To read from database,we still need to write the webservice which connects the database and gives API to web client.I used Node.js here.
As pointed in Extjs proxy(see「App.model.Item Price」)、The web service is「ret」、to write this I used「express」module.To implement reading from MongoDB I used「Mongoose」module.
var express = require('express'),
app = module.exports = express();
// MongoDB
var mongoose = require('mongoose'),
db = mongoose.connect('mongodb://127.0.0.1/IaaSDBG2');
//create the price info Model using the 'pricecatalogue' collection as a data-source
var PriceCatalg = mongoose.model('pricecatalogue', new mongoose.Schema({
Category: String,
SE: String,
Version : String,
Unit: String,
Partname: String,
OTC: Number,
MC: Number,
Currency: String,
Attributes: [{
FieldKey: String,
FieldValue: String
}]
}));
// Configuration
app.configure(function () {
//app.set('views', __dirname + '/views');
//app.set('view engine', 'jade');
app.use(express.bodyParser());//parse JSON into objects
app.use(express.methodOverride());
app.use(app.router);
app.use(express.static(__dirname + '/IaaSPriceTool'));
});
app.configure('development', function () {
app.use(express.errorHandler({
dumpExceptions: true,
showStack: true
}));
});
app.configure('production', function () {
app.use(express.errorHandler());
});
// Routes
app.get('/', function (req, res) {
res.redirect('/index.html');
});
/*
PriceItem in database GET Express web service
*/
app.get('/itemprices', function (req, res) {
PriceCatalg.find({}, function (err, compntPrices) {
res.contentType('json');
res.json({
success: true,
prices: compntPrices
});
});
});
app.listen(3000);
console.log("Express server listening on port %d in %s mode", 3000, app.settings.env);(2)Loading from file
Ext.define('App.model.AppConfig', {
extend : 'Ext.data.Model',
fields : [{
name : 'VERSION',
type : 'string'
}],
hasMany : [{
name : 'COMPONENTS',
model : 'App.model.CompntConfig',
associationKey : 'COMPONENTS'
}]
});Ext.define('App.model.CompntConfig', {
extend : 'Ext.data.Model',
fields : [{
name : 'CATEGORY',
type : 'string'
},{
name : 'SE',
type : 'string'
},{
name : 'UNIT',
type : 'string'
}],
hasMany : [{
name : 'FIELDS',
model : 'App.model.FieldConfig',
associationKey : 'FIELDS'
}],
belongsTo: 'App.model.AppConfig'
});Ext.define('App.model.FieldConfig', {
extend : 'Ext.data.Model',
fields : [{
name : 'NAME',
type : 'string'
}, {
name : 'FULLNAME',
type : 'string'
}],
belongsTo: 'App.model.CompntConfig'
});var ConfigStore = Ext.create('Ext.data.Store', {
model : 'App.model.AppConfig',
proxy : {
type : 'ajax',
url : "./PriceCatalgJson_V2.0.json",
reader : {
type : 'json'
}
}
});