dojo introduction

Hi,

I am stepping into Dojo tool kit. It really cool design. So keep visit my post. Hope you know lot about dojo Design.

Here that means already someone post tooltip. so i am skip that and going to tell in little advance.dojotip

Can you guess what function above.

When you open that window only Register button show. but when u click Register it popup one window that It holding two field as like as above image.

Before step in we need to know what think done.

Step1:

dojoParseOnLoad=”true”

dojoTheme=”true”

Step 2:

Need to include what are module( say function) going to use

Ex:

<xp:this.resources>

<xp:dojoModule name=”dijit.form.DropDownButton”>

</xp:dojoModule>

<xp:dojoModule name=”dijit.TooltipDialog”></xp:dojoModule>

</xp:this.resources>

<xp:this.resources>

<xp:dojoModule name=”dijit.form.DropDownButton”>

</xp:dojoModule>

<xp:dojoModule name=”dijit.TooltipDialog”></xp:dojoModule>

</xp:this.resources>

Step 3:

Include your dojo module

Ex:

<div dojoType=”dijit.form.DropDownButton”>

<xp:button value=”Register” id=”label3″></xp:button>

<div dojoType=”dijit.TooltipDialog”>

<xp:label value=”name” id=”label1″></xp:label>

<xp:inputText id=”inputText1″></xp:inputText>

<xp:label value=”mobile number” id=”label2″></xp:label>

<xp:inputText id=”inputText2″></xp:inputText>

</div>

</div>

Explanation Above code

The first line < div dojoType=”dijit.form.DropDownButton”> It describe the under components going to act drop down button

<xp:button value=”Register” id=”label3″></xp:button> This is component to act drop down

<div dojoType=”dijit.TooltipDialog”>- Descripe tool tip dialog. Under which going to appear in dialog box.

Full code:

<?xml version=”1.0″ encoding=”UTF-8″?>

<xp:view xmlns:xp=”http://www.ibm.com/xsp/core” dojoParseOnLoad=”true”

dojoTheme=”true”>

<xp:this.resources>

<xp:dojoModule name=”dijit.form.DropDownButton”>

</xp:dojoModule>

<xp:dojoModule name=”dijit.TooltipDialog”></xp:dojoModule>

</xp:this.resources>

<div dojoType=”dijit.form.DropDownButton”>

<xp:button value=”Register” id=”label3″></xp:button>

<div dojoType=”dijit.TooltipDialog”>

<xp:label value=”name” id=”label1″></xp:label>

<xp:inputText id=”inputText1″></xp:inputText>

<xp:label value=”mobile number” id=”label2″></xp:label>

<xp:inputText id=”inputText2″></xp:inputText>

</div>

</div>

</xp:view>

Note:

After copy and paste the following code make sure that whether double quote come correctly