Simple Integration of Supermodel and Appcelerator Titanium Alloy - Clearly Innovative | Web and Mobile DevelopmentClearly Innovative | Web and Mobile Development

SuperModel & Alloy Part One

This is a simple example of integrating Supermodel with Appcelerator Titanium Alloy for one approach for dealing with relationships in Backbonejs models.

Supermodel does a bunch of different things so I suggest that you take a look at the documentation for additional features. I think one of the more interesting one is the ability to track duplication models in the application and keep them in sync within the collection, but for this post, we are focusing on Supermodel’s association functionality to support relationships in applications.

Quick Walkthrough of the Code

I would recommend that you take a look a the post mentioned below to understand how I am working with Alloy Models below, since I will assume there is a basic understanding of the way I am integrating the Alloy Sync Adapter.

BlogPost: Quick Way to work with Models and Alloy in Appcelerator Titanium



First you will need to download Supermodel.js from here and add it to your lib directory of your Alloy project.

Next we will modify the index.js to create the necessary models. In this example we are going to create an Exam object and the Exam object will have Question’s associated with the Exam.

We will extend the SuperModel Model Object to create the necessary properties Alloy need to function, specifically the adapter collection_name in this case.

Once we have our base model let’s create the Exam and the Question Models

Now we need to create the associated collections for completeness. We will only be using the Exam collection here in this example but I wanted to show both

Next we establish the relationships between the objects. See the Supermodel has documentation for additional information on what is being done and why.

After the relationships are created, we need to an Exam object

This is a simple loop to create some question objects and associate them with the exam.

Now we have some simple debug log statements to see the output when querying the Exam

Next Time

In the second part of this, we will get into more of the full CRUD actions with the models and start to look at some of the other relationship capabilities. I am learning this as I go along, and do not claim to be an expert on the approach outlined above so please provide feedback using the comments section below.


 Helpful Links