Skip to main content

Learning Dojo: Add Dojo and Dijit to a page


Step 1: Add the standard Dojo Headers
<style type="text/css">
@import "/dojoroot/dijit/themes/tundra/tundra.css" ;
@import "/dojoroot/dojo/resources/dojo.css"
</style>

<script type="text/javascript" src="/dojoroot/dojo/dojo.js"
djConfig="parseOnLoad: true" ></script>

In Dijit Terminology, a them is a set of fonts, colors, and sizing settings for components so they look good together. Three themes come prepackaged with Dijit - Tunra, Sorta, and Nihilo - and you can develop your own themes as well.

The <script> tag pulls the Dojo code from your server. The djConfig="parseOnLoad:true" attribute is required to use Dojo elements decoratively.

Step 2: Set the Class of the Body
</head>
<body class="tundra">

The class name will match the theme name in lowercase: tundra, soria ornihilo.

Step 3: Add dojo.require Statements.

<script type="text/javascript">
dojo.require("dojo.parser" );
dojo.require("dijit.layout.ContentPane" );
</script>

The dojo.parser module is required for all pages using declarative Dijit. Then you load the dijit.layout.ContentPane module, required to draw Dijit content panes. Dojo modules correspond roughly to JavaScript files under /dojoroot. For example, requiring dijit.layout.TabContainer loads the JavaScript script /dojoroot/dijit/layout/TabContainer.js.


dojo.require is one of the most important functions in Dojo. But how do you know which modules to include? In this series, I will always introduce a new component or Doj API, say the Date API, with its module name, for example, dojo.date.

You will be applying these three steps to every page using Dojo or Dijit Once the browser loads the theme style sheet and executes the Dojo Script, processes the dojo.require statments, and sets the <body> class, you're ready to roll.

Comments

Post a Comment

Popular posts from this blog

Stretch a row if data overflows in jasper reports

It is very common that some columns of the report need to stretch to show all the content in that column. But  if you just specify the property " stretch with overflow' to that column(we called text field in jasper report world) , it will just stretch that column and won't change other columns, so the row could be ridiculous. Haven't find the solution from internet yet. So I just review the properties in iReport one by one and find two useful properties(the bold  highlighted in example below) which resolve the problems.   example: <band height="20" splitType="Stretch" > <textField isStretchWithOverflow="true" pa...
4 comments
Read more

Live - solving the jasper report out of memory and high cpu usage problems

I still can not find the solution. So I summary all the things and tell my boss about it. If any one knows the solution, please let me know. Symptom: 1.        The JVM became Out of memory when creating big consumption report 2.        Those JRTemplateElement-instances is still there occupied even if I logged out the system Reason:         1. There is a large number of JRTemplateElement-instances cached in the memory 2.     The clearobjects() method in ReportThread class has not been triggered when logging out Action I tried:      About the Virtualizer: 1.     Replacing the JRSwapFileVirtualizer with JRFileVirtualizer 2.     Not use any FileVirtualizer for c...
1 comment
Read more

JasperReports - Configuration Reference

Data Source / Query Executer net.sf.jasperreports.csv.column.names.{arbitrary_name} net.sf.jasperreports.csv.date.pattern net.sf.jasperreports.csv.encoding net.sf.jasperreports.csv.field.delimiter net.sf.jasperreports.csv.locale.code net.sf.jasperreports.csv.number.pattern net.sf.jasperreports.csv.record.delimiter net.sf.jasperreports.csv.source net.sf.jasperreports.csv.timezone.id net.sf.jasperreports.ejbql.query.hint.{hint} net.sf.jasperreports.ejbql.query.page.size net.sf.jasperreports.hql.clear.cache net.sf.jasperreports.hql.field.mapping.descriptions net.sf.jasperreports.hql.query.list.page.size net.sf.jasperreports.hql.query.run.type net.sf.jasperreports.jdbc.concurrency net.sf.jasperreports.jdbc.fetch.size net.sf.jasperreports.jdbc.holdability net.sf.jasperreports.jdbc.max.field.size net.sf.jasperreports.jdbc.result.set.type net.sf.jasperreports.query.chunk.token.separators net.sf.jasperreports.query.executer.factory.{language} net.sf.jasperreports.xpath....
Post a Comment
Read more