How To Use DOJO Object Store?

In my previous article I have explained about the pie chart, bar chart and how to setup DOJO framework. These examples are written with very basic concepts to make the readers understand how to write a simple application without any dynamic data populated from the external storage. This article is the first step towards taking the readers to learn basics about the working on DOJO application with huge amount of data.

DOJO 1.6 has released a great concept as DOJO Object Stores which is simplest way for storing the data locally and manipulate for the presentation. This is emphasized from the  HTML5 object store API idea. Compare to the complex SQL type queries and storage, it is very simple key value pairs and have simple query methods to access the values stored in the local storage.

The easiest way to start using the store is to implement dojo/store/Memory. This is simple key,value pairs stored in an array. All the values inside array are considered as an object itself. That is why it is called as object stores. dojo/store/Memory allows browser to store the data in the local memory and use ti for the temporary purpose. In most of the cases, we are tend to use the temporary storage for caching and presenting data based on the user interactions.

//Creating object store from the array
 var employeeStore = new dojo.store.Memory({
 data: employees,
 idProperty: "name"
 });

Look at the above code, dojo.store.Memory creates new object with the array employees. It is that simple. Later, employeeStore can be used for retrieving the data from the Memory store.

DOJO Object Store Example

require(["dojo/store/Memory",
"dojo/ready"],

function (Memory, ready) {
ready(function () {

//Creating array of data set
 var employees = [{
 name: "Krishna",
 topic: "Sales"
 }, {
 name: "Mohhamad",
 topic: "Sales"
 }, {
 name: "Sanaulla",
 topic: "Marketing"
 }, {
 name: "Raja",
 topic: "Marketing"
 }];

//Creating object store from the array
 var employeeStore = new dojo.store.Memory({
 data: employees,
 idProperty: "name"
 });

//Adding new data to the object store directly
 employeeStore.add({
 name: "Manisha",
 topic: "Advertising"
 });

//Query the object store to retrieve data
 employeeStore.query({
 topic: "Marketing"
 }).forEach(function (employee) {
 alert(employee.name);
 });

//Retrieving from object store as object
 obj = employeeStore.get("Krishna");
 alert(obj.topic);

//Pu object to store
 obj.topic = "Marketing";
 employeeStore.put(obj);

//Query it again using sort
 employeeStore.query({
 topic: "Marketing"
 }, {
 sort: [{
 attribute: "topic",
 ascending: false
 }]
 }).forEach(function (employee) {
 alert("Sort: " + employee.name);
 });
 });
});

DOJO Object Store API

DOJO object store defines set of methods for accessing the data inside store and perform any operations using these methods.

1. get(id) –> This method retrieves the object inside an array be looking up the id
2. query (query, options) –> This is most widely used API method in the object store.  One of the greatest advantage of using the object store is its flexible query method. One can directly use this method on the object store and use the values inside the store. The second parameter in this method “options” used for filtering the values by passing the predefined filer properties.
3. put(object, options) –> This method simply adds back the object to the store. It means that existing object, once update is completed, use this method to add the object back to the store. Otherwise changes done on that object will not be reflected in the store.
4. add(object, options) –> It is simply adding the new object to the store.
5. remove(id) –> Removing an object from the store using identifier.
6. getIdentity(object) –> This method used for fetching id by passing the object.
7. queryEngine(query, options) –> This API can be used for advanced operations using query method.
8. transaction() –> Starts the transaction.
9. getChildren(object, options) –> Returns child object.
10. getMetadata(object) –> Retrieves any additional details about an object.

A simple example of how to use object store’s API can be used for a store. Simply use the store’s instance and invoke the method. In the above example, I have used few of the API methods defined above, in the similar way one can use all the methods. If there is any error throw while trying the above example, please write it in the comments section. I will provide help for anyone who contacts me for learning DOJO.

employeeStore.query({
topic: "Marketing"
}).forEach(function (employee) {
alert(employee.name);
});

With the above syntax, it is easy to filter the data using the query method. It can offers sorting of data by passing another argument. As already mentioned in this article, each value inside array is considered as a object itself.

obj = employeeStore.get("Krishna");

Once object is assigned to a variable, just like that update to new values as mentioned in the above example.Note that the object has to be added back to the store using the method put.Otherwise the changes will not be reflected in the object store.

Demo of the above example code

I hope this article given good insight on the basic concepts on the object store. There is JsonRest object store which is used for storing the data from the server. I would write one more article about that in my next article. In practical, Memory and JsonRest would be used together. Keep register with our website (twitter | facebook)to get the latest articles for free.

Reference:

• DOJO Store
• HTML5 Web Storage

Recommended Books:

• Learning DOJO
• JavaScript Pocket Reference
• Head First jquery