SequelSphereDB / Ext JS 4 Connector

SequelSphereDB / Ext JS 4 Connector Overview

SequelSphere has created a "Connector" between Ext JS 4 and SequelSphereDB to enable a seamless integration between the two products. This connector enables SQL to be used for populating grids and charts in Ext JS, and even allows SQL to be executed against existing Ext JS data stores.

Ext.ux.data.SqlStore

The initial point of contact for the connector is a new Ext JS class created by SequelSphere called Ext.ux.data.SqlStore . This "SQL Store" is an Ext JS 4 User Extension (Plugin) that inherits all the functionality of an Ext JS data Store, but adds the ability to have the contents of the Store be populated with the results of a SQL Query. The SqlStore does this by utilizing SequelSphereDB's SQL Query Engine to perform any of the SQL passed to it.

The SqlStore can be created in Javascript as follows:

var store = Ext.create('Ext.ux.data.SqlStore', {
    storeId: "EmplDeptQuery",
    sql: "SELECT empl_id, e.name, age, d.name as dept_name " +
         "  FROM empl e " +
         "  JOIN dept d " +
         "    ON e.dept_id = d.dept_id " +
         " WHERE age > 30"
});
	

The above snippet of code will create a new ' SqlStore ' with the results of executing the SQL passed to it.

Querying Ext JS 4 Stores as Tables

Also included in the connector is the ability to use any existing Ext JS Stores as Tables to be queried via SQL. Any store that is managed by the Ext JS StoreManager will automatically be made available to query in any SQL statement. For example, applications can create JSON and ARRAY stores as follows:

Ext.create('Ext.data.ArrayStore', {
	storeId: 'Empl',
	model: Ext.define('EmplModel', {
		extend: 'Ext.data.Model',
		idProperty: 'empl_id',
		fields: [
			{name: 'empl_id', type: 'int'},
			{name: 'name', type: 'string'},
			{name: 'age', type: 'int'},
			{name: 'dept_id', type: 'int' }
		]
	}),
	data: [
		[0,"Bob",32,0],
		[1,"John",37,2],
		[2,"Fred",28,1],
		[3,"Sue",26,3],
		[4,"Beth",22,99],
		[5,"Mary",27,3],
		[6,"Adrian",24,1]
	]
});

Ext.create('Ext.data.JsonStore', {
	storeId: 'Dept',
	model: Ext.define('DeptModel', {
		extend: 'Ext.data.Model',
		idProperty: 'dept_id',
		fields: [
			{name: 'dept_id', type: 'int' },
			{name: 'name', type: 'string'},
			{name: 'mgr_id', type: 'int'}
		]
	}),
	data: [
		{ dept_id: 0, name: "Finance", mgr_id: 0 },
		{ dept_id: 1, name: "Accounting", mgr_id: 4 },
		{ dept_id: 2, name: "I/T", mgr_id: 99 },
		{ dept_id: 3, name: "Marketing", mgr_id: 1 },
		{ dept_id: 4, name: "Janitorial Services", mgr_id: 5 }
	]
});
	

Afterwards, queries against SequelSphereDB will execute against those tables:

var results = db.query(
         "SELECT empl_id, e.name, age, d.name as dept_name " +
         "  FROM empl e " +
         "  JOIN dept d " +
         "    ON e.dept_id = d.dept_id " +
         " WHERE age > 30"
);
	

Or, you can create a ' SqlStore ' that also executes a query against those tables:

var store = Ext.create('Ext.ux.data.SqlStore', {
    storeId: "EmplDeptQuery",
    sql: "SELECT empl_id, e.name, age, d.name as dept_name " +
         "  FROM empl e " +
         "  JOIN dept d " +
         "    ON e.dept_id = d.dept_id " +
         " WHERE age > 30"
});