dojo anchor

To use this tag:

Add: <%@ taglib prefix="sx" uri="/struts-dojo-tags" %> to your page.
The head tag must be included on the page, which can be configured for performance or debugging purposes.
If the parseContent parameter for the head tag is false (it is false by default), then the id tag is required.

Additional Examples

For more examples see Ajax and JavaScript Recipes

Description

A tag that creates an HTML <a/> element, that when clicked makes an asynchronous request(XMLHttpRequest). The url attribute must be build using the <s:url/> tag.

There's a bug in IE6/IE7 which makes impossible to use the target's attribute with a parent Div, because such Div's content's are overwritten with the tag's loadingText. Resulting in an "undefined" message in the content's, instead of the result of the request.

One possible alternative is to set showLoadingText="false" and set the indicator attribute to an element showing the desired loading text or image (outside the div).

<img id="loadingImage" src="images/loadingAnimation.gif" style="display:none"/>
<s:div id="parentDiv">
    <s:form action="actionName">
        <sx:a targets="parentDiv" showLoadingText="false" indicator="loadingImage"/>
    </s:form>
</s:div>

Parameters

Name	Required	Default	Evaluated	Type	Description
Dynamic Attributes Allowed: false

accesskey	false		false	String	Set the html accesskey attribute on rendered html element
afterNotifyTopics	false		false	String	Comma delimmited list of topics that will published after the request(if the request succeeds)
ajaxAfterValidation	false	false	false	Boolean	Make an asynchronous request if validation succeeds. Only valid if 'validate' is 'true'
beforeNotifyTopics	false		false	String	Comma delimmited list of topics that will published before the request
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 to use for element
disabled	false		false	String	Set the html disabled attribute on rendered html element
errorNotifyTopics	false		false	String	Comma delimmited list of topics that will published after the request(if the request fails)
errorText	false		false	String	The text to display to the user if the is an error fetching the content
executeScripts	false	false	false	Boolean	Javascript code in the fetched content will be executed
formFilter	false		false	String	Function name used to filter the fields of the form.
formId	false		false	String	Form id whose fields will be serialized and passed as parameters
handler	false		false	String	Javascript function name that will make the request
highlightColor	false	none	false	String	Color used to perform a highlight effect on the elements specified in the 'targets' attribute
highlightDuration	false	2000	false	Integer	Duration of highlight effect in milliseconds. Only valid if 'highlightColor' attribute is set
href	false		false	String	The URL to call to obtain the content. Note: If used with ajax context, the value must be set as an url tag value.
id	false		false	String	The id to use for the element
indicator	false		false	String	Id of element that will be shown while making request
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)
listenTopics	false		false	String	Topic that will trigger the remote call
loadingText	false	Loading...	false	String	Text to be shown while content is being fetched
name	false		false	String	The name to set for element
notifyTopics	false		false	String	Comma delimmited list of topics that will published before and after the request, and on errors
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.
parseContent	false	true	false	Boolean	Parse returned HTML for Dojo widgets
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)
separateScripts	false	true	false	String	Run scripts in a separate scope, unique for each tag
showErrorTransportText	false	true	false	Boolean	Set whether errors will be shown or not
showLoadingText	false	false	false	Boolean	Show loading text on targets
tabindex	false		false	String	Set the html tabindex attribute on rendered html element
targets	false		false	String	Comma delimited list of ids of the elements whose content will be updated
template	false		false	String	The template (other than default) to use for rendering the element
templateDir	false		false	String	The template directory.
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
transport	false	XMLHTTPTransport	false	String	Transport used by Dojo to make the request
validate	false	false	false	Boolean	Perform Ajax validation. 'ajaxValidation' interceptor must be applied to action
value	false		false	String	Preset the value of input element.

Examples

Update target content with html returned from an action:

<div id="div1">Div 1</div>
<s:url id="ajaxTest" value="/AjaxTest.action"/>

<sx:a id="link1" href="%{ajaxTest}" target="div1">
     Update Content
</sx:a>

Submit form(anchor inside the form):

<s:form id="form" action="AjaxTest">
     <input type="textbox" name="data">
     <sx:a>Submit form</sx:a>           
</s:form>

Submit form(anchor outside the form):

<s:form id="form" action="AjaxTest">
     <input type="textbox" name="data">   
</s:form>

<sx:a formId="form">Submit form</sx:a>

Using beforeNotifyTopics:

<script type="text/javascript">
dojo.event.topic.subscribe("/before", function(event, widget){
    alert('inside a topic event. before request');
    //event: set event.cancel = true, to cancel request
    //widget: widget that published the topic
});
</script>         

<sx:a beforeNotifyTopics="/before">Publish topics</sx:a>

Using afterNotifyTopics and highlights target:

<script type="text/javascript">
dojo.event.topic.subscribe("/after", function(data, request, widget){
    alert('inside a topic event. after request');
    //data : text returned from request(the html)
    //request: XMLHttpRequest object
    //widget: widget that published the topic
});
</script>        

<sx:a afterNotifyTopics="/after" highlightColor="red" href="%{#ajaxTest}">Publish topics</sx:a>

Using errorNotifyTopics and indicator:

<script type="text/javascript">
dojo.event.topic.subscribe("/error", function(error, request, widget){
    alert('inside a topic event. on error');
    //error : error object (error.message has the error message)
    //request: XMLHttpRequest object
    //widget: widget that published the topic
});
</script>         

<img id="ind1" src="${pageContext.request.contextPath}/images/indicator.gif" style="display:none"/>
<sx:a errorNotifyTopics="/error" indicator="ind1" href="%{#ajaxTest}">Publish topics</sx:a>

Description

Parameters

Dynamic Attributes Allowed:

Name

Required

Default

Evaluated

Type

Description

Examples