MicroStrategy ONE

Registering the JSON object with the Factory

Based on the Model-View-Controller architectural pattern, a view's HTML is a reflection of the view's properties and its model's properties. The model is the true repository of data, while the view is simply one possible visual representation of that data.  A view's properties are applied to configure that representation, but the raw data itself typically resides in a separate model object; not in the view's properties.

After the JSON representation for the PromptEditor view block and the ReportInstanceModel model block is successfully achieved, the final steps to display the Prompt page are as follow.

  1. Define a JavaScript "model" object
  2. Define a JavaScript "view" object
  3. Connect the view to the model
  4. Tell the view to render itself in HTML

This is achieved by the following lines of code with each non-commented line corresponding to the step numbered above. All the JSON is converted to live JavaScript objects in the Web browser’s memory.

Copy 
<!-- Register this JSON object with the factory -->
 var mstrView = mstr.$register('jsonPromptEditor', self);
 var mstrModel = mstr.$register('jsonPromptReportInstanceModel', self);
 mstrView.setModel(mstrModel);
 mstrView.render();

The JavaScript global variable, mstrView, is a core view. It is an instance of mstr.views.Editor from the Editor view block (PromptEditor view block inherits Editor view block). The Editor view is a container for other views.  These other nested views form a tree-like view structure representing the GUI for all the prompt questions on the Prompt page. The view structure is assembled at run-time on the Web server by transforms.

The JavaScript global variable, mstrModel is a core model. It is an instance of mstr.models.ReportInstance from the ReportInstanceModel model block. mstrModel is a tree-like data structure representing all the prompt questions on the page. Its properties are populated at run-time on the Web server by transforms.

mstr.$register is a shortcut for mstr.controller.factory.registerElement.

The setModel method sets the model property for the view. Based on the code above, the PromptEditor view block is linked with the ReportInstanceModel model block. The view attaches event listeners to be notified of changes in the model's properties. Resetting the model property to another object causes the view to re-attach its event listeners and re-render itself.

Finally, after the view and model are linked, the PromptEditor view calls the render() method to generate its HTML on the Web browser.

Since the JSON objects for the PromptEditor view block and the ReportInstanceModel model block are registered, all custom view and model blocks added under the appropriate places in the PromptEditor view block and ReportInstanceModel model block are automatically registered.