JSFiddle - React, Tailwind, and code Playground
HTML
<link rel="stylesheet" href="http://cdn.sencha.io/ext-4.1.1-gpl/resources/css/ext-all.css">
JavaScript
Ext.define('a', {
extend: 'Ext.data.Model',
fields: ['id', 'name'],
associations: [{
type: 'hasOne',
model: 'b'
}]
});
Ext.define('b', {
extend: 'Ext.data.Model',
fields: [{
name: 'id',
type: 'int'
},{
name: 'ldap'
}]
});
Ext.onReady(function () {
var store = Ext.create('Ext.data.ArrayStore', {
model: 'a',
data: [{
id: '1',
name: 'user-1',
b: {
id: 2,
ldap: 'ert'
}
}, {
id: '2',
name: 'user-2',
b: {
id: 1,
ldap: 'dfg'
}
}, {
id: '3',
name: 'user-3',
b: {
id: 3,
ldap: 'hjk'
}
}, {
id: '4',
name: 'user-4',
b: {
id: 1,
ldap: 'yuio'
}
}, {
id: '5',
name: 'user-5',
b: {
id: 3,
ldap: 'ljjolic'
}
}],
proxy: {
type: 'memory',
reader: {
type: 'json'
}
}
});
var d = Ext.create("a");
console.log("ASD")
d.set('name', 'fff');
console.log("ASD1")
d.getb().set('ldap', 'asd')
console.log("ASD2")
console.log(d.getb().get('ldap'));
Ext.widget({
xtype: 'grid',
title: 'Records',
width: 400,
height: 180,
store: store,
renderTo: Ext.getBody(),
columns: [{
text: 'id',
dataIndex: 'id'
}, {
text: 'name',
dataIndex: 'name'
}, {
text: 'b_id',
renderer: function (v, m, r) {
return r.getb().get('id');
}
}, {
text:'b_ldap',
renderer: function(v, m, r){
...