sourceforge > tacos
 
 

Dialog

Provides a modal dhtml-based Dialog component that is capable of disabling all input on the screen except for the contents of the Dialog. This component is just a wrapper around the dojo Dialog widget implementation.

There aren't really any parameters to give to the Dialog component as it is really just used to wrap content. Most of the interactions with it involve either hiding/showing the contents it contains. To make any form/area of your page display within a Dialog all you have to do is wrap the area with this component.

The majority of uses for this component involve having a hidden area of a page that is wrapped by this component. The component is made visible one of two ways, via invoking it's hide()/show() method from within one of your server invoked listeners, or by invoking hide()/show() on the dojo widget found on your page. 

    
<a href="javascript:dojo.widget.byId('DialogContent').show();">
Show Dialog
</a>

The id parameter passed into the dojo widget system should be the same tapestry id that your component is using.

Note
AjaxForms should be entirely contained within a Dialog component (as shown in the example that follows).

See also: Ajax dialog article. , Live Demo

Parameters

Name Type Direction Required Default Description
hidden boolean in no false Used to specify whether the component should be considered to be in a hidden state. The default value should be sufficient for the majority of cases.

Body: rendered

Informal parameters: allowed

Examples

This example displays a login form to a user.

HTML template

          
<a href="javascript:dojo.widget.byId('DialogContent').show();">Show Dialog</a>
 
<div jwcid="@Any" id="userDisplay">
<span jwcid="@If" condition="ognl:userValid" >
<p>
 Welcome <i><span jwcid="@Insert" value="ognl:username" /></i>, isn't this cool?
</p>
</span>
</div>

<script type="text/javascript">
    function closeDialog() {
        dojo.widget.byId('DialogContent').hide();
    }
</script>

<div jwcid="DialogContent@tacos:Dialog" hidden="ognl:dlHidden" 
    bgColor="white" bgOpacity="0.5">
	<form jwcid="sampleForm" class="dialog" >
        <fieldset>
        <legend>Login</legend>
        <p>Enter your username/password to login.</p>
        
        <div class="fm-opt">
        <span jwcid="@FieldLabel" field="component:user"/>
        <input jwcid="user@TextField" value="ognl:username" displayName="Username"/>
		</div>
        
        <div class="fm-opt">
        <span jwcid="@FieldLabel" field="component:password"/>
        <input jwcid="password@TextField" value="ognl:userPassword" 
                hidden="true" displayName="Password" />
		</div>
        
        <div id="fm-hsubmit" class="dialog" >
            <input jwcid="cancel@Submit" 
                onClick="closeDialog();return false;" 
                value="Cancel" />
        </div> 
        <div id="fm-hsubmit" class="dialog" >
		   <input jwcid="formSubmit@Submit" 
            value="OK" />
        </div>
        </fieldset>
	</form>
</div>

Page specification

          
<page-specification class="net.sf.tacos.demo.pages.core.DialogExample">
	
	<description>Shows usage of dojos dialog component</description>
    
    <property name="username" persist="session" />
    <property name="userPassword" persist="session" />
    <property name="dlHidden" persist="session" initial-value="false" />
    <property name="userValid" persist="session" initial-value="ognl:false" />
    
    <component id="sampleForm" type="tacos:AjaxForm" >
        <binding name="listener" value="listener:showUserName" />
        <binding name="updateComponents" value="ognl:{'userDisplay','DialogContent'}" />
    </component>
    
</page-specification>

Java sources

          
/**
 * Demonstrates using dojo's dialog component along
 * with the tacos {@link AjaxForm} component.
 * 
 * @author jkuhnert
 */
public abstract class DialogExample extends BasePage {
    
    /** input username */
    public abstract String getUsername();
    /** sets user name */
    public abstract void setUsername(String value);
    /** Sets the validity of user */
    public abstract void setUserValid(boolean value);
    
    /**
     * If they've set a username already.
     * @return
     */
    public abstract boolean isUserValid();
    
    /**
     * Invoked by form
     * @param cycle
     */
    public void showUserName(IRequestCycle cycle)
    {
        String user = (String)cycle.getParameter("user");
        if (user != null && user.equalsIgnoreCase("admin")) {
            setUsername(user);
            setUserValid(true);
            ((Dialog)getComponent("DialogContent")).hide();
        } else {
            setUserValid(false);
            IValidationDelegate delegate = ((IForm)getComponent("sampleForm")).getDelegate();
            delegate.record((IFormComponent)getComponent("user"), "Your name isn't admin");
            ((Dialog)getComponent("DialogContent")).show();
        }
    }
}