ZCS 6.0:Zimlet Developers Guide:Examples:Dialogs: Difference between revisions

(New page: {| cellspacing="0" cellpadding="5" style="border: 1px solid rgb(153, 153, 170); margin: 0pt 0.5em 0.5em 0pt; float: none; background-color: rgb(249, 249, 255);" |[[Image:zdg-6-menu-icon-zi...)
 
Line 55: Line 55:
</pre>
</pre>


== Creating the Dialog ==
== Creating the Dialogs ==


Here is snippet from the Zimlet Handler Object. The application context object is used to create the dialogs.
Here is snippet from the Zimlet Handler Object. The application context object is used to create the dialogs.


For the message dialog:
=== Message Dialogs ===


<pre>
<pre>
Line 69: Line 69:
<pre>
<pre>
this._dialog.setButtonListener(DwtDialog.OK_BUTTON, new AjxListener(this, this._okBtnListener)); // listens for OK button events
this._dialog.setButtonListener(DwtDialog.OK_BUTTON, new AjxListener(this, this._okBtnListener)); // listens for OK button events
</pre>  
</pre>
 
=== Error Dialog ===
 
<pre>
this._dialog = appCtxt.getErrorDialog(); // returns ZmErrorDialog
</pre>
 
We attach a listener on the "OK" button of the error dialog. When the "OK" button is pressed, the <code>_okBtnListener</code> method is called.
 
<pre>
this._dialog.setButtonListener(DwtDialog.OK_BUTTON, new AjxListener(this, this._okBtnListener)); // listens for OK button events
</pre>
 
=== Yes-No Dialog ===
 
<pre>
this._dialog = appCtxt.getYesNoMsgDialog(); // returns DwtMessageDialog
</pre>
 
We attach a listener on the "YES" and "NO" buttons of the dialog. When the "YES" or "NO" button is pressed, the <code>_yesBtnListener</code> and <code>_noBtnListener</code> methods are called respectively.
 
<pre>
this._dialog.setButtonListener(DwtDialog.YES_BUTTON, new AjxListener(this, this._yesBtnListener)); // listens for YES button events
this._dialog.setButtonListener(DwtDialog.NO_BUTTON, new AjxListener(this, this._noBtnListener)); // listens for NO button events
</pre>


== Download ==
== Download ==

Revision as of 17:12, 15 January 2010

Zdg-6-menu-icon-zimbra.jpg Introduction Zdg-6-menu-icon-green-flag.png Getting Started Zdg-6-menu-icon-terminal.png Dev Environment Setup Zdg-6-menu-icon-gear.png Developing Zimlets Zdg-6-menu-icon-advanced.jpg Advanced Concepts Zdg-6-menu-icon-library.jpg API Specifications Zdg-6-menu-icon-checkbox.jpg Example Zimlets

Description

This zimlet shows-up as a panel item and will display series of dialogs based on your selection from the zimlet menu items.

Screenshot

The zimlet panel has the following menu:

Zcs-6-examples-simpledialog.png

Menu Item Dialog Image
Message Dialog (info) Creates a message dialog with "info" style (DwtMessageDialog.INFO_STYLE) Zcs-6-examples-dialogs-info.png

Definition File

<zimlet name="com_zimbra_dialogs" version="0.1" description="Creates various dialogs">
  <include>com_zimbra_dialogs.js</include>
  <handlerObject>com_zimbra_dialogsHandlerObject</handlerObject>
  <zimletPanelItem label="Dialogs Zimlet">
    <contextMenu>
      <menuItem label="Message Dialog (info)" icon="zimbraIcon" id="com_zimbra_dialogs_msgInfodlg"/>
      <menuItem label="Message Dialog (warn)" icon="zimbraIcon" id="com_zimbra_dialogs_msgWarndlg"/>
      <menuItem label="Message Dialog (critical)" icon="zimbraIcon" id="com_zimbra_dialogs_msgCriticaldlg"/>
      <menuItem label="Error" icon="zimbraIcon" id="com_zimbra_dialogs_errordlg"/>
      <menuItem label="Yes/No Dialog" icon="zimbraIcon" id="com_zimbra_dialogs_yesnodlg"/>
      <menuItem label="Yes/No/Cancel Dialog" icon="zimbraIcon" id="com_zimbra_dialogs_yesnocanceldlg"/>			 
    </contextMenu>
  </zimletPanelItem>
</zimlet>

Creating the Dialogs

Here is snippet from the Zimlet Handler Object. The application context object is used to create the dialogs.

Message Dialogs

this._dialog = appCtxt.getMsgDialog(); // returns DwtMessageDialog

We attach a listener on the "OK" button of the message dialog. When the "OK" button is pressed, the okBtnListener method is called.

this._dialog.setButtonListener(DwtDialog.OK_BUTTON, new AjxListener(this, this._okBtnListener)); // listens for OK button events

Error Dialog

this._dialog = appCtxt.getErrorDialog(); // returns ZmErrorDialog

We attach a listener on the "OK" button of the error dialog. When the "OK" button is pressed, the _okBtnListener method is called.

this._dialog.setButtonListener(DwtDialog.OK_BUTTON, new AjxListener(this, this._okBtnListener)); // listens for OK button events

Yes-No Dialog

this._dialog = appCtxt.getYesNoMsgDialog(); // returns DwtMessageDialog

We attach a listener on the "YES" and "NO" buttons of the dialog. When the "YES" or "NO" button is pressed, the _yesBtnListener and _noBtnListener methods are called respectively.

this._dialog.setButtonListener(DwtDialog.YES_BUTTON, new AjxListener(this, this._yesBtnListener)); // listens for YES button events
this._dialog.setButtonListener(DwtDialog.NO_BUTTON, new AjxListener(this, this._noBtnListener)); // listens for NO button events

Download

Zimlet Package com_zimbra_simpledialog.zip


Useful Links


Verified Against: Zimbra Collaboration Suite 6.0 Date Created: 01/15/2010
Article ID: https://wiki.zimbra.com/index.php?title=ZCS_6.0:Zimlet_Developers_Guide:Examples:Dialogs Date Modified: 2010-01-15



Try Zimbra

Try Zimbra Collaboration with a 60-day free trial.
Get it now »

Want to get involved?

You can contribute in the Community, Wiki, Code, or development of Zimlets.
Find out more. »

Looking for a Video?

Visit our YouTube channel to get the latest webinars, technology news, product overviews, and so much more.
Go to the YouTube channel »

Jump to: navigation, search