Question
I'm building a web application using struts2 and the jquery plugin. I'm trying to use the "indicator" functionality included in the jquery plugin. Indeed I would like to fire a popup saying "loading..." when the user performs some actions (button clicks, list selection...).
So I have this master page MasterPage.jsp:
https://stackoverflow.com/questions/14682103
italiano
english
français
española
中国
日本の
العربية
Deutsch
한국어
Português
Russian<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
pageEncoding="ISO-8859-1"%>
<%@ taglib prefix="s" uri="/struts-tags"%>
<%@ taglib prefix="sj" uri="/struts-jquery-tags"%>
<head>
<s:url id="customTheme" value="/template/themes" ></s:url>
<sj:head defaultIndicator="indictor" jqueryui="true" jquerytheme="warrtheme" customBasepath="%{customTheme}" />
</head>
<body>
<sj:dialog id="indicator"
title="Loading"
autoOpen="false"
modal="true"
resizable="false">
<table>
<tr>
<td> </td>
<td><img src="<s:url value="/images/indicator.gif" />" /></td>
<td>Loading...</td>
</tr>
</table>
</sj:dialog>
</body>
</html>
And I have this regular page User.jsp:
<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
pageEncoding="ISO-8859-1"%>
<%@ taglib prefix="s" uri="/struts-tags"%>
<%@ taglib prefix="sj" uri="/struts-jquery-tags"%>
<div class="content">
<s:url var="openViewUser" namespace="/administration" action="administration_utilisateur_open" />
<sj:a href="%{openViewUser}" id="divUserLink" targets="divUser" indicator="indicator">
<div id="divUser"></div>
</div>
When I click the link in the above code, the popup doesn't show up. Any clue guys ?
Thanks in advance.
Solution 2
you have to subscribe the open topics or you have to trap the onclick event .Suppose you want to show dialog on click
function openDialog()
{
$("#indicator").dialog('open');
}
and once the ajax is loaded successfully ,close the dialog box using this
$("#indicator").dialog('close');
OTHER TIPS
I'd like to post the complete code that works for me...
On the MasterPage.jsp:
<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
pageEncoding="ISO-8859-1"%>
<%@ taglib prefix="s" uri="/struts-tags"%>
<%@ taglib prefix="sj" uri="/struts-jquery-tags"%>
<%@ taglib prefix="tiles" uri="http://tiles.apache.org/tags-tiles"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<s:url id="customTheme" value="/template/themes" ></s:url>
<sj:head jqueryui="true" jquerytheme="warrtheme" customBasepath="%{customTheme}" />
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<script type="text/javascript">
$.subscribe('onBeforeLoading', function(event,data) {
$("#indicator").dialog('open');
});
$.subscribe('onCompleteLoading', function(event,data) {
$("#indicator").dialog('close');
});
</script>
</head>
<body>
<sj:dialog id="indicator"
title="Warning"
autoOpen="false"
modal="true"
resizable="false">
<table>
<tr>
<td> </td>
<td><img src="<s:url value="/images/indicator.gif" />" /></td>
<td>Loading, please wait...</td>
</tr>
</table>
</sj:dialog>
</body>
</html>
And on the User.jsp:
<%@ page language="java" contentType="text/html; charset=ISO-8859-1" pageEncoding="ISO-8859-1"%>
<%@ taglib prefix="s" uri="/struts-tags"%>
<%@ taglib prefix="sj" uri="/struts-jquery-tags"%>
<div class="content">
<s:url var="openViewUser" namespace="/administration" action="administration_utilisateur_open" />
<sj:a href="%{openViewUser}" id="divUserLink" targets="divUser" onBeforeTopics="onBeforeLoading" onCompleteTopics="onCompleteLoading" >Click me</sj:a>
<br/>
<br/>
<div id="divUser"></div>
</div>
