Dojox/app: Is it possible to define views programatically

Question

Is it possible to code a view programatically instead of using an html template? All the demos I have seen use an html template.

Answer 1

Yes it is possible. Add your HTML markup as a string for property templateString, the following code does not use an .html template as for your question. You can use string concatenation in order to modify your template programatically.

More information on templateString here.

Example below is taken from user Ben from this answer to a my older question:

require(['dijit/_WidgetBase', 'dijit/_TemplatedMixin', 'dojo/_base/declare', 'dojo/domReady!'], function(_WidgetBase, _TemplatedMixin, declare, domReady) {

    //Foo represent any widget with template available in dojo
    //replace by the widget you want to use
    var Foo = declare([_WidgetBase, _TemplatedMixin], {});

    var foo = new Foo({
      templateString: '<div>This is my teemplate and ${bar}</div>',
      bar: "this is added to the template"
    });

    
    foo.placeAt('layout');

});

<link rel="stylesheet" href="//ajax.googleapis.com/ajax/libs/dojo/1.10.4/dijit/themes/claro/claro.css" media="screen">
<script src="//ajax.googleapis.com/ajax/libs/dojo/1.10.4/dojo/dojo.js"></script>
<div id="layout"></div>

Answer 2

You can also use placeholder's in your HTML template having defined basic tag structure in template and providing value's to the placeholder from JS side.

Ex:

<div>

<div data-dojo-type="dojox.layout.contentpane" >
{content}
</div>

</div>

OR

You may also modify some HTML template dynamically from "postMixInProperties()"

Refer to Widget Life cycle to get some info on that http://dojotoolkit.org/reference-guide/1.10/dijit/_WidgetBase.html