Buttonset

Introduction

This function allows you to use the jQuery UI buttonset widget for checkbox lists or radio buttons.

Samples

A checkbox list as jQuery UI buttonset

<%@ taglib prefix="s" uri="/struts-tags"%>
<%@ taglib prefix="sj" uri="/struts-jquery-tags"%>
<html>
  <head>
	<sj:head jqueryui="true"/>
  </head>
  <body>
	<div id="formResult" class="result ui-widget-content ui-corner-all">Submit form bellow.</div>
    
    	<s:form id="form" action="echo" theme="xhtml">
	    <sj:checkboxlist
	    		id="checkboxbuttonset"
		    tooltip="Choose your Friends"
		    label="Friends"
		    list="{'Patrick', 'Jason', 'Jay', 'Toby', 'Rene'}"
		    name="echo"/>
	    <sj:submit 
	    	targets="formResult" 
	    	value="AJAX Submit" 
	    	indicator="indicator"
	    	button="true"
	    />
    	</s:form>

    	<img id="indicator" src="images/indicator.gif" alt="Loading..." style="display:none"/>    
  </body>
</html>

Radio buttons as jQuery UI buttonset

<%@ taglib prefix="s" uri="/struts-tags"%>
<%@ taglib prefix="sj" uri="/struts-jquery-tags"%>
<html>
  <head>
    <sj:head jqueryui="true"/>
  </head>
  <body>
	<div id="formResult" class="result ui-widget-content ui-corner-all">Submit form bellow.</div>
    
    <s:form id="form" action="echo" theme="simple">
	    <label for="echo">Choose your Friend: </label>
		    <sj:radio
		    		id="radiobuttonset"
			    list="{'Patrick', 'Jason', 'Jay', 'Toby', 'Rene'}"
			    name="echo"/>
		    <br/>
	    <sj:submit 
		   	targets="formResult" 
		   	value="AJAX Submit" 
		   	indicator="indicator"
		   	button="true"
	   	/>
    </s:form>

    <img id="indicator" src="images/indicator.gif" alt="Loading..." style="display:none"/>    
  </body>
</html>

Attributes

Name	Required	Default	Evaluated	Type	Description
accesskey	false		false	String	Set the html accesskey attribute on rendered html element
bindOn	false		false	String	Bind the start of load or effect on element. e.g. button or link
buttonset	false	true	false	Boolean	Disable or enable the jQuery UI buttonset feature.
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, ...
deferredLoading	false	false	false	Boolean	Defers the initial loading of this element. The element will not be loaded until one of the reloadTopics is published.
disabled	false		false	String	Set the html disabled attribute on rendered html element
draggable	false		false	String	Enable draggable functionality to the DIV element. Move the draggable object by clicking on it with the mouse and dragging it anywhere within the viewport.
draggableAddClasses	false		false	Boolean	If set to false, will prevent the ui-draggable class from being added. This may be desired as a performance optimization when calling draggable init on many hundreds of elements. Default: true
draggableAppendTo	false		false	String	The element passed to or selected by the appendTo option will be used as the draggable helper's container during dragging. By default, the helper is appended to the same container as the draggable. Default: parent
draggableAxis	false		false	String	Constrains dragging to either the horizontal (x) or vertical (y) axis. Possible values: x or y.
draggableCancel	false		false	String	Prevents dragging from starting on specified elements.
draggableContainment	false		false	String	Constrains dragging to within the bounds of the specified element or region. Possible string values: parent, document, window, [x1, y1, x2, y2].
draggableCursor	false		false	String	The css cursor during the drag operation.
draggableDelay	false		false	String	Time in milliseconds after mousedown until dragging should start. This option can be used to prevent unwanted drags when clicking on an element.
draggableDistance	false		false	String	Distance in pixels after mousedown the mouse must move before dragging should start. This option can be used to prevent unwanted drags when clicking on an element.
draggableHandle	false		false	String	If specified, restricts drag start click to the specified element(s). e.g. h2
draggableHelper	false		false	String	Allows for a helper element to be used for dragging display. Possible values: original, clone. Default is original
draggableIframeFix	false		false	Boolean	Prevent iframes from capturing the mousemove events during a drag. Useful in combination with cursorAt, or in any case, if the mouse cursor is not over the helper. If set to true, transparent overlays will be placed over all iframes on the page. If a selector is supplied, the matched iframes will have an overlay placed over them. Default: false
draggableOnDragTopics	false		false	String	This event javascript function is triggered when the mouse is moved during the dragging.
draggableOnStartTopics	false		false	String	This event javascript function is triggered when dragging starts.
draggableOnStopTopics	false		false	String	This event javascript function is triggered when dragging stops.
draggableOpacity	false		false	String	Opacity for the helper while being dragged. e.g. 0.75
draggableRefreshPositions	false		false	Boolean	If set to true, all droppable positions are calculated on every mousemove. Caution: This solves issues on highly dynamic pages, but dramatically decreases performance. Default: false
draggableRevert	false		false	String	If set to true, the element will return to its start position when dragging stops. e.g. true, valid, invalid Default: false
draggableRevertDuration	false		false	String	The duration of the revert animation, in milliseconds. Ignored if revert is false.
draggableScope	false		false	String	Used to group sets of draggable and droppable items, in addition to droppable's accept option. A draggable with the same scope value as a droppable will be accepted by the droppable.
draggableScroll	false		false	Boolean	If set to true, container auto-scrolls while dragging.
draggableScrollSensitivity	false		false	String	Distance in pixels from the edge of the viewport after which the viewport should scroll. Distance is relative to pointer, not the draggable. Default: 20
draggableScrollSpeed	false		false	String	The speed at which the window should scroll once the mouse pointer gets within the scrollSensitivity distance. Default: 20
draggableSnap	false		false	Boolean	If set to true, the draggable will snap to the edges of the selected elements when near an edge of the element. Default: false
draggableSnapMode	false		false	String	Determines which edges of snap elements the draggable will snap to. Ignored if snap is false. Possible values: inner, outer, both. Default: both
draggableSnapTolerance	false		false	String	The distance in pixels from the snap element edges at which snapping should occur. Ignored if snap is false. Default: 20
draggableZindex	false		false	String	z-index for the helper while being dragged.
droppable	false		false	String	Enable any DIV element to be droppable, a target for draggable elements.
droppableAccept	false		false	String	All draggables that match the jQuery selector will be accepted. e.g. #myid or .myclass
droppableActiveClass	false		false	String	If specified, the class will be added to the droppable while an acceptable draggable is being dragged.
droppableAddClasses	false	true	false	String	If set to false, will prevent the ui-droppable class from being added. This may be desired as a performance optimization when calling droppable init on many hundreds of elements. Default: true
droppableGreedy	false	false	false	String	If true, will prevent event propagation on nested droppables. Default: false
droppableHoverClass	false		false	String	If specified, the class will be added to the droppable while an acceptable draggable is being hovered.
droppableOnActivateTopics	false		false	String	This event javascript function is triggered any time an accepted draggable starts dragging. This can be useful if you want to make the droppable 'light up' when it can be dropped on.
droppableOnDeactivateTopics	false		false	String	This event javascript function is triggered any time an accepted draggable stops dragging.
droppableOnDropTopics	false		false	String	This event javascript function is triggered when an accepted draggable is dropped 'over' this droppable.
droppableOnOutTopics	false		false	String	This event javascript function is triggered when an accepted draggable is dragged 'out' this droppable.
droppableOnOverTopics	false		false	String	This event javascript function is triggered as an accepted draggable is dragged 'over' this droppable.
droppableScope	false		false	String	Used to group sets of draggable and droppable items, in addition to droppable's accept option. A draggable with the same scope value as a droppable will be accepted.
droppableTolerance	false		false	String	Specifies which mode to use for testing whether a draggable is over a droppable. Possible values: fit, intersect, pointer, touch.
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
effectMode	false	none	false	String	The Effect Mode. show, hide, toggle, none
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.
errorPosition	false		false	String	Define error position of form element (top\|bottom)
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
events	false	click	false	String	Start load or effect on specified event. Possible values are click, dblclick, mouseover, mouseenter, mouseleave. Default: click
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)
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)
list	false		false	String	Iterable source to populate from. If the list is a Map (key, value), the Map key will become the option 'value' parameter and the Map value will become the option body.
listKey	false		false	String	Property of list objects to get field value from
listValue	false		false	String	Property of list objects to get field content from
listenTopics	false		false	String	The comma separated list 'listenTopics' is the list of topic names that is used to trigger a request.
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)
name	false		false	String	The name to set for element
onAfterValidationTopics	false		false	String	A comma delimited list of topics that published after the Ajax validation. event.originalEvent.formvalidate to see if validation passed/failed.
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	Topics that are published before after load is completed
onDisableTopics	false		false	String	A comma delimited list of topics that published when the element disabled
onEffectCompleteTopics	false		false	String	A comma delimited list of topics that published when an effect is completed
onEnableTopics	false		false	String	A comma delimited list of topics that published when the element is enabled
onErrorTopics	false		false	String	Topics that are published on a load error
onFocusTopics	false		false	String	A comma delimited list of topics that published when the element is focused
onSuccessTopics	false		false	String	Topics that are published after a succesful load
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.
parentTheme	false		false	String	The parent theme. Default: value of parent form tag or simple if no parent form tag is available
reloadTopics	false		false	String	A comma delimited list of topics that will cause this element to reload
requestType	false	POST	false	String	Type of the AJAX Request. POST, GET, PUT
requiredLabel	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	Boolean	Enable this div element to be resizable. With the cursor grab the right or bottom border and drag to the desired width or height.
resizableAnimate	false		false	Boolean	Animates to the final size after resizing. Default: false
resizableAnimateDuration	false		false	String	Duration time for animating, in milliseconds.
resizableAnimateEasing	false		false	String	Easing effect for animating. Default: swing
resizableAspectRatio	false		false	Boolean	If set to true, resizing is constrained by the original aspect ratio. Default: false
resizableAutoHide	false		false	Boolean	If set to true, automatically hides the handles except when the mouse hovers over the element. Default: false
resizableContainment	false		false	String	Constrains resizing to within the bounds of the specified element. Possible values: 'parent', 'document' or an id
resizableDelay	false		false	String	Tolerance, in milliseconds, for when resizing should start. If specified, resizing will not start until after mouse is moved beyond duration. This can help prevent unintended resizing when clicking on an element.
resizableDistance	false		false	String	Tolerance, in pixels, for when resizing should start. If specified, resizing will not start until after mouse is moved beyond distance. This can help prevent unintended resizing when clicking on an element.
resizableGhost	false		false	Boolean	If set to true, a semi-transparent helper element is shown for resizing. Default: false
resizableHandles	false		false	String	If specified as a string, should be a comma-split list of any of the following: 'n, e, s, w, ne, se, sw, nw, all'. Default: e, s, se
resizableHelper	false		false	String	This is the css class that will be added to a proxy element to outline the resize during the drag of the resize handle. Once the resize is complete, the original element is sized. e.g. ui-state-highlight
resizableMaxHeight	false		false	String	This is the maximum height the resizable should be allowed to resize to.
resizableMaxWidth	false		false	String	This is the maximum width the resizable should be allowed to resize to.
resizableMinHeight	false		false	String	This is the minimum height the resizable should be allowed to resize to.
resizableMinWidth	false		false	String	This is the minimum width the resizable should be allowed to resize to.
resizableOnResizeTopics	false		false	String	This event javascript function is triggered during the resize, on the drag of the resize handler.
resizableOnStartTopics	false		false	String	This event javascript function is triggered at the start of a resize operation.
resizableOnStopTopics	false		false	String	This event javascript function is triggered at the end of a resize operation.
selectable	false		false	Boolean	Enable a element to be selectable. Draw a box with your cursor to select items. Hold down the Ctrl key to make multiple non-adjacent selections.
selectableAutoRefresh	false		false	String	This determines whether to refresh (recalculate) the position and size of each selectee at the beginning of each select operation. If you have many many items, you may want to set this to false and call the refresh method manually. Default: true
selectableCancel	false		false	String	Prevents selecting if you start on elements matching the selector. Default: ':input,option'
selectableDelay	false		false	String	Time in milliseconds to define when the selecting should start. It helps preventing unwanted selections when clicking on an element.
selectableDistance	false		false	String	Tolerance, in pixels, for when selecting should start. If specified, selecting will not start until after mouse is dragged beyond distance.
selectableFilter	false		false	String	The matching child elements will be made selectees (able to be selected). Default: '*'
selectableOnSelectedTopics	false		false	String	This event is triggered at the end of the select operation, on each element added to the selection.
selectableOnSelectingTopics	false		false	String	This event is triggered during the select operation, on each element added to the selection.
selectableOnStartTopics	false		false	String	This event is triggered at the beginning of the select operation.
selectableOnStopTopics	false		false	String	This event is triggered at the end of the select operation.
selectableOnUnselectedTopics	false		false	String	This event is triggered at the end of the select operation, on each element removed from the selection.
selectableOnUnselectingTopics	false		false	String	This event is triggered during the select operation, on each element removed from the selection.
selectableTolerance	false		false	String	Possible values: 'touch', 'fit'. Default: 'touch'
sortable	false		false	Boolean	Enable a elements to be sortable
sortableAppendTo	false		false	String	Defines where the helper that moves with the mouse is being appended to during the drag. Default: 'parent'
sortableAxis	false		false	String	If defined, the items can be dragged only horizontally or vertically. Possible values:'x', 'y'.
sortableCancel	false		false	String	Prevents sorting if you start on elements matching the selector. Default: ':input,button'
sortableConnectWith	false		false	String	Takes a jQuery selector with items that also have sortables applied. If used, the sortable is now connected to the other one-way, so you can drag from this sortable to the other. e.g. #myothersortable or .myothersortables
sortableContainment	false		false	String	Constrains dragging to within the bounds of the specified element - can be a DOM element, 'parent', 'document', 'window', or a jQuery selector.
sortableCursor	false		false	String	Defines the cursor that is being shown while sorting.
sortableCursorAt	false		false	String	Moves the sorting element or helper so the cursor always appears to drag from the same position. Coordinates can be given as a hash using a combination of one or two keys: top, left, right, bottom.
sortableDelay	false		false	String	Time in milliseconds to define when the sorting should start. It helps preventing unwanted drags when clicking on an element.
sortableDistance	false		false	String	Tolerance, in pixels, for when sorting should start. If specified, sorting will not start until after mouse is dragged beyond distance. Can be used to allow for clicks on elements within a handle.
sortableDropOnEmpty	false		false	Boolean	If empty allows for an item to be dropped from a linked selectable. Default: true
sortableForceHelperSize	false		false	Boolean	If true, forces the helper to have a size. Default: false
sortableForcePlaceholderSize	false		false	Boolean	If true, forces the placeholder to have a size. Default: false
sortableGrid	false		false	String	Snaps the sorting element or helper to a grid, every x and y pixels. Array values: [x, y]
sortableHandle	false		false	String	Restricts sort start click to the specified element.
sortableHelper	false		false	String	Allows for a helper element to be used for dragging display. The supplied function receives the event and the element being sorted, and should return a DOMElement to be used as a custom proxy helper. Possible values: 'original', 'clone'. Default: 'original'
sortableItems	false		false	String	Specifies which items inside the element should be sortable. Default: '> *'
sortableOnActivateTopics	false		false	String	This event is triggered when using connected lists, every connected list on drag start receives it.
sortableOnBeforeStopTopics	false		false	String	This event is triggered when sorting stops, but when the placeholder/helper is still available.
sortableOnChangeTopics	false		false	String	This event is triggered during sorting, but only when the DOM position has changed.
sortableOnDeactivateTopics	false		false	String	This event is triggered when sorting was stopped, is propagated to all possible connected lists.
sortableOnOutTopics	false		false	String	This event is triggered when a sortable item is moved away from a connected list.
sortableOnOverTopics	false		false	String	This event is triggered when a sortable item is moved into a connected list.
sortableOnReceiveTopics	false		false	String	This event is triggered when a connected sortable list has received an item from another list.
sortableOnRemoveTopics	false		false	String	This event is triggered when a sortable item has been dragged out from the list and into another.
sortableOnSortTopics	false		false	String	This event is triggered during sorting.
sortableOnStartTopics	false		false	String	This event is triggered when sorting starts.
sortableOnStopTopics	false		false	String	This event is triggered when sorting has stopped.
sortableOnUpdateTopics	false		false	String	This event is triggered when the user stopped sorting and the DOM position has changed.
sortableOpacity	false		false	String	Defines the opacity of the helper while sorting. From 0.01 to 1
sortablePlaceholder	false		false	String	Class that gets applied to the otherwise white space.
sortableRevert	false		false	Boolean	If set to true, the item will be reverted to its new DOM position with a smooth animation. Default: false
sortableScroll	false		false	Boolean	If set to true, the page scrolls when coming to an edge. Default: true
sortableScrollSensitivity	false		false	String	Defines how near the mouse must be to an edge to start scrolling. Default: 20
sortableScrollSpeed	false		false	String	The speed at which the window should scroll once the mouse pointer gets within the scrollSensitivity distance. Default: 20
sortableTolerance	false		false	String	This is the way the reordering behaves during drag. Possible values: 'intersect', 'pointer'. In some setups, 'pointer' is more natural. Default: 'intersect'
sortableZindex	false		false	String	Z-index for element/helper while being sorted. Default: 1000
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	Set the html title attribute on rendered html 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
value	false		false	String	Preset the value of input element.

Struts Project Page - Showcase - Showcase Grid - Download - Developer Blog - Developer News

Home
- News
- Changelog
- FAQ
- Upgrade Guide
- Head & Themeing
Ajax
UI widgets
- Tabbed Panel
  - Tab
- Datepicker
- Dialog
- Accordion
- Autocompleter
- Progressbar
- Slider
- Spinner
- Menu
  - MenuItem
- Chart
  - Chart Data
- Grid
- DataTables
- Tree
  - Tree Item
- Button
- Buttonset
- Richtext Editor
  - Ckeditor Editor
  - Tinymce Editor
UI interactions
- Resizable for Divs
- Drag and Drop for Divs
- Selectable for Divs
- Sortable for Divs
Form Elements
Tasks
- Form Validation
- Work with JSON Results

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Buttonset

Introduction

Samples

A checkbox list as jQuery UI buttonset

Radio buttons as jQuery UI buttonset

Attributes

Name

Required

Default

Evaluated

Type

Description

Clone this wiki locally