dojo.data, stores and
widgets
Tobias von Klipstein - klipstein@uxebu.com
uxebu Consulting Ltd. & Co. KG

dojo.data?
• uniform and consistent data access layer
• hides the underlying data structure
(JSON, XML, CSV)
• a set of APIs/interfaces for writing data
stores
• unique way to handle data with widgets

The big picture
Stores Widgets
API
dojo.data.Read dojo.data.ItemFileReadStore dijit.form.ComboBox
dojo.data.Identity dijit.form.FilteringSelect
dojox.data.QueryReadStore
dijit.Tree
dojox.data.CsvStore
dojox.grid.DataGrid
dojo.data.Write dojo.data.ItemFileWriteStore
...
...
dojo.data.Notification

Terminology
dojo.data Database Term
datastore cursor
data source database
item row
attribute column
value -
reference (foreign key)
identity primary key
query WHERE clause of SQL Select
dojo.data APIs JDBC or ODBC
request SQL Select

dojo.data APIs
• dojo.data.api.Read
• dojo.data.api.Write
• dojo.data.api.Identity
• dojo.data.api.Notification

dojo.data.api.Read
• •
determine the APIs testing any object, if it
that a datastore is an item of a store
implements
• lazy-loading of items
• determine attributes
• searching for items
of each data item
that match a query
• getting values of
• sorting
attributes
• paging
• testing, if a specific
•
value is contained in filtering (using query
an attribute and wildcards: *, _)

dojo.data.api.Write
• provides functions for:
• creating new items
• modifiying items
• deleting items

dojo.data.api.Identity
• identify items by unique key

dojo.data.api.Notification
• implemented in conjunction with Write API
• provides notifications for:
• item creation (onNew)
• item modification (onSet)
• item deletion (onDelete)

Available stores
• dojo.data
• ItemFileReadStore
• ItemFileWriteStore
• dojox.data
• QueryReadStore
• CsvStore
• HtmlTableStore
• ServiceStore
• XmlStore

More stores
(dojox.data)
• AndOrReadStore • ItemExplorer
• AndOrWriteStore • JsonQueryRestStore
• AppStore • JsonRestStore
• AtomReadStore • KeyValueStore
• CouchDBRestStore • OpenSearchStore
• CssClassStore • OpmlStore
• CssRuleStore • PersevereStore
• FileStore • PicasaStore
• FlickrRestStore • RailsStore
• FlickrStore • S3Store
• GoogleFeedStore • SnapLogicStore
• GoogleSearchStore • StoreExplorer
• HtmlStore • WikipediaStore

ItemFileReadStore
• reading JSON
• from an http endpoint (url attribute)
• in-memory JavaScript-object (data attr.)
• deserialization of values (typeMap attr.)
• implements Read/Identity API (read-only!)
• using a predefined JSON structure

ItemFileReadStore
compatible json data
{'identifier': 'abbr',
'label': 'name',
'items': [
{ 'abbr':'ec', 'name':'Ecuador', 'capital':'Quito' },
{ 'abbr':'eg', 'name':'Egypt', 'capital':'Cairo' },
{ 'abbr':'sv', 'name':'El Salvador', 'capital':'San Salv.' },
{ 'abbr':'gq', 'name':'Equatorial Guinea','capital':'Malabo'},
...
}

dojo.data fetch (1)
var store = new SomeStoreName({ /* store config data */);
store.fetch({
start: 0, // from where?
count: 1000, // how many, tops?
query: {
// store specific!
},
sort: [
{ attribute: “attrName”, descending: true },
// ...
],
onBegin: function(numberFetched, request){ /* ... */ },
onComplete: function(itemsArr, request){ /* ... */ },
onError: function(errObj, request){ /* ... */ },
});

dojo.data fetch (2)
var onCompleteHandler = function(itemsArr, request){
dojo.forEach(itemsArr, function(item){
console.debug(
store.getValue(item, “someAttributeName”);
store.getIdentity(item); // returns the identity attr
store.getLabel(item);
};
}

Widgets using stores
• •
dijit.form.ComboBox dojox.form.FilePickerTextBox,
dojox.widget.FilePicker
• (dojox.data.FileStore)
dijit.form.FilteringSelect
•
• dojox.widget.Pager
dijit.Tree
•
• dojox.widget.Roller
dojox.grid.DataGrid
•
• dojox.widget.RollingList
dojox.charting
•
• dojox.widget.SortList
dojox.image.SlideShow
• dojox.image.ThumbnailPicker

ComboBox / FilteringSelect

Tree

Grid

Charting

Slideshow

ThumbnailPicker

FilePicker

Pager

Roller

RollingList

SortList

DataGrid
• Supports incremental data fetch/render and sort
• Provides highly flexible layouts...
• Locked columns
• Cell formatters
• Complex row definitions
• Paging via scrolling

Thank you!
Tobias von Klipstein, klipstein@uxebu.com