JSFiddle - React, Tailwind, and code Playground
HTML
<script src="https://extjs.cachefly.net/ext/gpl/5.1.0/build/ext-all-debug.js"></script>
<script src="https://extjs.cachefly.net/ext/gpl/5.1.0/packages/ext-theme-neptune/build/ext-theme-neptune.js"></script>
<link rel="stylesheet" href="https://extjs.cachefly.net/ext/gpl/5.1.0/packages/ext-theme-neptune/build/resources/ext-theme-neptune-all-debug.css">
<script src="https://extjs.cachefly.net/ext/gpl/5.1.0/packages/sencha-charts/build/sencha-charts-debug.js"></script>
<link rel="stylesheet" href="https://extjs.cachefly.net/ext/gpl/5.1.0/packages/sencha-charts/build/neptune/resources/sencha-charts-all-debug.css">
JavaScript
Ext.application({
name : 'Fiddle',
launch : function() {
Ext.define('User', {
extend: 'Ext.data.Model',
fields: [
{name: 'firstName', type: 'string'},
{name: 'lastName', type: 'string'},
{name: 'age', type: 'int'},
{name: 'eyeColor', type: 'string'}
]
});
var store = Ext.create('Ext.data.Store', {
model: 'User',
groupField: 'firstName',
data : [
{firstName: 'Ed', lastName: 'Spencer'},
{firstName: 'Tommy', lastName: 'Maintz'},
{firstName: 'Aaron', lastName: 'Conran'},
{firstName: 'Jamie', lastName: 'Avins'}
]
});
var firstGroupName = store.getGroups().getAt(0).getGroupKey();
Ext.Msg.alert('Fiddle', 'First group name is ' + firstGroupName);
}
});