My favorites | Sign in
Logo
Project Home
  
Downloads
  
Wiki
  
Issues
  
Source
    
Search
for
Updated Nov 17, 2009 by johgep
Labels: Phase-Implementation
DialogTag  
The Dialog widget renders a HTML Dialog with local or remote content.

Introduction

This tag generates an Dialog that can load content into the Dialog using an AJAX call.

For custom themes for the Dialog take look at the Head Tag.

Samples

Local Dialog

<%@ taglib prefix="s" uri="/struts-tags"%>
<%@ taglib prefix="sj" uri="/struts-jquery-tags"%>
<html>
  <head>
    <sj:head jqueryui="true"/>
  </head>
  <body>
    <sj:dialog id="mydialog1" title="Local Dialog">
     Mauris mauris ante, blandit et, ultrices a, suscipit eget, quam. Integer ut neque. Vivamus nisi metus, molestie vel, gravida in, condimentum sit amet, nunc. Nam a nibh. Donec suscipit eros. Nam mi. Proin viverra leo ut odio. Curabitur malesuada. Vestibulum a velit eu ante scelerisque vulputate.
   </sj:dialog>
  </body>
</html>

Remote Dialog

<%@ taglib prefix="s" uri="/struts-tags"%>
<%@ taglib prefix="sj" uri="/struts-jquery-tags"%>
<html>
  <head>
    <sj:head jqueryui="true"/>
  </head>
  <body>
    <s:url id="remoteurl" action="myremoteaction"/>
    <sj:dialog id="mydialog2" href="%{remoteurl}" title="Remote Dialog"/>
  </body>
</html>

Remote Dialog open on Click

<%@ taglib prefix="s" uri="/struts-tags"%>
<%@ taglib prefix="sj" uri="/struts-jquery-tags"%>
<html>
  <head>
    <sj:head jqueryui="true"/>
  </head>
  <body>
    <s:url id="remoteurl" action="myremoteaction"/>
    <sj:dialog id="mydialog3" href="%{remoteurl}" title="Remote Dialog open on Click" autoOpen="false"/>
   <sj:a openDialog="mydialog3">Open Dialog</sj:a>
  </body>
</html>

Modal Remote Dialog with Effects

<%@ taglib prefix="s" uri="/struts-tags"%>
<%@ taglib prefix="sj" uri="/struts-jquery-tags"%>
<html>
  <head>
    <sj:head jqueryui="true"/>
  </head>
  <body>
    <s:url id="remoteurl" action="myremoteaction"/>
    <sj:dialog id="mydialog4" href="%{remoteurl}" title="Modal Remote Dialog with Effects" modal="true" showEffect="slide" hideEffect="explode"/>
  </body>
</html>

Dialog with Buttons

<%@ taglib prefix="s" uri="/struts-tags"%>
<%@ taglib prefix="sj" uri="/struts-jquery-tags"%>
<html>
  <head>
    <sj:head jqueryui="true"/>
     <script type="text/javascript">
      function okButton(event){
       alert('OK Button pressed!');
     };
     function cancelButton(event){
      alert('Cancel Button pressed!');
     };
   </script>        
  </head>
  <body>
    <s:url id="remoteurl" action="myremoteaction"/>
    <sj:dialog id="mydialog5" href="%{remoteurl}" title="Dialog with Buttons" buttons="'OK':function() {okButton();},'Cancel':function() {cancelButton();}"/>
  </body>
</html>

Attributes

Name

Required

Default

Evaluated

Type

Description
accesskey false false String Set the html accesskey attribute on rendered html element
autoOpen false false String When autoOpen is true the dialog will open automatically when dialog is called. If false it will stay hidden until .dialog('open') is called on it. Default: true
buttons false false String Specifies which buttons should be displayed on the dialog. The property key is the text of the button. The value is the callback function for when the button is clicked.
cssClass false false String The css class to use for element
cssErrorClass false false String The css error class to use for element
cssErrorStyle false false String The css error style definitions for element to use
cssStyle false false String The css style definitions for element to use
dataType false false String Type of the result. e.g. html, xml, text, json, ...
dialogClass false false String The specified class name(s) will be added to the dialog, for additional theming.
disabled false false String Set the html disabled attribute on rendered html element
draggable false false String If set to true, the dialog will be draggable will be draggable by the titlebar. Default: true
effect false none false String Perform a effect on the elements specified in the 'targets' attribute. e.g. bounce, highlight, pulsate, shake, size or transfer. See more details at http://docs.jquery.com/UI/Effects
effectDuration false 2000 false String Duration of effect in milliseconds. Only valid if 'effect' attribute is set
effectOptions false false String jQuery options for effect, eg 'color : #aaaaaa' for the highlight effect or 'times : 3' for the bounce effect. Only valid if 'effect' attribute is set. See more details at http://docs.jquery.com/UI/Effects
errorElementId false false false String This should provide the id of the element into which the error text will be placed when an error ocurrs loading the container. If 'errorTest' is provided, that wil be used, otherwise the ajax error message text wil be used.
errorText false false false String The text to be displayed on load error. If 'errorElement' is provided, this will display the error in the elemtn (if existing), if not, it will display the error as the contents of this container
formIds false false String Comma delimited list of form ids for which to serialize all fields during submission when this element is clicked (if multiple forms have overlapping element names, it is indeterminate which will be used)
height false false String The height of the dialog, in pixels.
hideEffect false false String The effect to be used when the dialog is closed. Values are slide, scale, blind, clip, puff, explode, fold and drop. Default: none
href false false String The url to be use when this element is clicked
id false false String HTML id attribute
indicator false false String If loading content into a target, Id of element that will be displayed during loading and hidden afterwards (will override settings for the target container)
javascriptTooltip false false false Boolean Use JavaScript to generate tooltips
key false false String Set the key (name, value, label) for this particular component
label false false String Label expression used for rendering an element specific label
labelSeparator false : false String String that will be appended to the label
labelposition false false String Define label position of form element (top/left)
loadingText false false String If loading content into a target, The text to be displayed during load (will be shown if any provided, will override settings for the target container)
maxHeight false false String The maximum height to which the dialog can be resized, in pixels.
maxWidth false false String The maximum width to which the dialog can be resized, in pixels.
minHeight false false String The minimum height to which the dialog can be resized, in pixels.
minWidth false false String The minimum width to which the dialog can be resized, in pixels.
modal false false String If set to true, the dialog will have modal behavior; other items on the page will be disabled (i.e. cannot be interacted with). Modal dialogs create an overlay below the dialog but above other page elements. Default: false
name false false String The name to set for element
onAlwaysTopics false false String A comma delimited list of topics that published always
onBeforeTopics false false String Topics that are published before a load
onBlurTopics false false String A comma delimited list of topics that published when the element is blured
onChangeTopics false false String A comma delimited list of topics that published when the element changed
onCompleteTopics false false String A comma delimited list of topics that published when the element ajax request is completed (will override settings for a target container if provided)
onDisableTopics false false String A comma delimited list of topics that published when the element disabled
onEnableTopics false false String A comma delimited list of topics that published when the element is enabled
onErrorTopics false false String A comma delimited list of topics that published when the element ajax request returns an error (will override settings for a target container if provided)
onFocusTopics false false String A comma delimited list of topics that published when the element is focused
onSuccessTopics false false String A comma delimited list of topics that published when the element ajax request is completed successfully (will override settings for a target container if provided)
onblur false false String Set the html onblur attribute on rendered html element
onchange false false String Set the html onchange attribute on rendered html element
onclick false false String Set the html onclick attribute on rendered html element
ondblclick false false String Set the html ondblclick attribute on rendered html element
onfocus false false String Set the html onfocus attribute on rendered html element
onkeydown false false String Set the html onkeydown attribute on rendered html element
onkeypress false false String Set the html onkeypress attribute on rendered html element
onkeyup false false String Set the html onkeyup attribute on rendered html element
onmousedown false false String Set the html onmousedown attribute on rendered html element
onmousemove false false String Set the html onmousemove attribute on rendered html element
onmouseout false false String Set the html onmouseout attribute on rendered html element
onmouseover false false String Set the html onmouseover attribute on rendered html element
onmouseup false false String Set the html onmouseup attribute on rendered html element
onselect false false String Set the html onselect attribute on rendered html element
openTemplate false false String Set template to use for opening the rendered html.
overlayColor false false String Overlay color when modal is true. e.g. #000
overlayOpacity false false String Overlay opacity when modal is true. e.g. 0.7
position false false String Specifies where the dialog should be displayed. Possible values: 'center', 'left', 'right', 'top', 'bottom', or an array containing a coordinate pair (in pixel offset from top left of viewport) or the possible string values (e.g. 'right','top' for top right corner). Default: 'center'
required false false false Boolean If set to true, the rendered element will indicate that input is required
requiredposition false false String Define required position of required form element (left|right)
resizable false false String If set to true, the dialog will be resizeable. Default: true
showEffect false false String The effect to be used when the dialog is opened. Values are slide, scale, blind, clip, puff, explode, fold and drop. Default: none
tabindex false false String Set the html tabindex attribute on rendered html element
targets false false String A comma separated list of ids of container elements to load with the contents from the result of this request
template false false String The template (other than default) to use for rendering the element
templateDir false false String The template directory.
timeout false 3000 false Integer jQuery options for timeout. Default is 3000
title false false String Specifies the title of the dialog. The title can also be specified by the title attribute on the dialog source element.
tooltip false false String Set the tooltip of this particular component
tooltipConfig false false String Deprecated. Use individual tooltip configuration attributes instead.
tooltipCssClass false StrutsTTClassic false String CSS class applied to JavaScrip tooltips
tooltipDelay false Classic false String Delay in milliseconds, before showing JavaScript tooltips
tooltipIconPath false false String Icon path used for image that will have the tooltip
validate false false false String Whether to execute validation on this elements of the form(s) provided in the formId attribute (valid values are 'true', 'false', and 'only'). Selecting 'only' will noly validate the form fiellds and not execute the result of this action implied by the href url
value false false String Preset the value of input element.
width false false String The width of the dialog, in pixels.
zindex false false String The starting z-index for the dialog. Default: 1000


Sign in to add a comment
Hosted by Google Code