Templates are describing how the data rendered inside data-view. You can define multiple templates and switch between them dynamically.

    view = new dhtmlXDataView({
	container:"data_container",
	type:{
            template:"#Package# : #Version#<br/>#Maintainer#",
	    height:40
        }
    });

the { Package:“a”, Version:“b”, Maintainer:“c”} will be rendered as

  a : b <br/> c

Template can be defined as part of constructor or later as

    view.define("type",{
        template:"#Package# : #Version#<br/>#Maintainer#"
    })

If you need to defin only text string and need not any extra properties, you can use “template” property directly on top level

    view = new dhtmlXDataView({
	container:"data_container",
        template:"#Package# : #Version#<br/>#Maintainer#"
    });

    view.define("type",{
        template:"#Package# : #Version#<br/>#Maintainer#"
    })

    view.define("type",{
        template:function(){ return obj.Package +"<br/>"+obj.Maintainer; }
    })

      <textarea id="template_container" rows="5" cols="60">
#Package# : #Version#
<br/>#Maintainer#</textarea>
...
    view.define("type",{
        template:"html->template_container",
    })

    view.define("type",{
        template:"http->../common/template.html",
    })

      dhtmlx.Type.add(dhtmlXDataView,{
         name:"dataA",
         template:"#Package# : #Version#<br/>#Maintainer#",
         height:40
      });
 
      data = new dhtmlXDataView({
         container:"data_container", 
         type:"dataA"
      });

#property# - replaced with value of related property

    view.define("type",{
           template:"#a# - #b#"
    })
// a - b

{common.property} - replaced with constant value from template

    view.define("type",{
           template:"#a# - {common.mydata}",
           mydata:25
    })
// a - 25

{common.method()} - replaced with result of method call

    view.define("type",{
           template:"#a# - {common.mymethod()}",
           mymethod:function(obj){
              return obj.b.toUpperCase();
           }
    })
// a - B

#property?valueA:valueB# - trinary operator

    view.define("type",{
           template:"#a# - #flag?exist:not exist#"
    })
// a - not exist

{-obj - replaced with ”#

Sometime it can be usefull to change some parameter of template - as result the view will be repainted with new configuration.

view.customize({
    height:100
});

If you will define some property in template as {common.some} , then you will be able to change it in any time by using “customize” command.

    view = new dhtmlXDataView({
	container:"data_container",
	type:{
			template:"#Package# : #Version#<br/>#Maintainer#",
 
			css:"some",
			width:120,
			height:40,
			margin:5,
			padding:0,
        }
    });

• template - template definition
• height - height of the item, int
• width - width of the item, int
• margin - margin of the item, int
• padding - padding of the item, int
• css - name, which will be used for styling of item, has “default” as default value

The item will have next css style assigned

  .dhx_dataview_default_item

If you will specify “name” parameter it will be

  .dhx_dataview_{name}_item

In selected state, the same item will have css class name as

  .dhx_dataview_default_item_selected

In addition to normal template, component can have additional task-specific templates

• template_edit -used for item during item editing process
• template_loading - used as stub while dynamic loading data from server

    view = new dhtmlXDataView({
      container:"data_container",
      edit:true,
      type:{
               template:"#Package# : #Version#<br/>#Maintainer#",
               template_edit:"<input class='dhx_item_editor' bind='obj.Package'>",
               template_loading:"Loading..."
           }
    });