Tags
People
Badges
Help-
CORE FRAMEWORK
FEATURED COMPONENTS
-
RESOURCES
-
LEARN ZK
RESOURCES
Hi,
I want that when the progressbox appears because an operation is taking too much time all the components of the page appears disabled (like when opening a modal window). Because if this doesn't happen when a process is running the user can click any button of the page time and time again and a lot of processes will be queued and executed one after another.
How can I do this?
Thanks for your help.
Neus,
Doesn't the Clients.showBusy() method do this already? Consider the following example:
<zk>
<window id="win">
<attribute name="onLater">
Thread.sleep(5000);
Clients.showBusy(null, false);
new Label(" Done.").setParent(win);
</attribute>
<button label="Start">
<attribute name="onClick">
Clients.showBusy("Processing... (wait about 5 sec.)", true);
Events.echoEvent("onLater", win, null);
</attribute>
</button>
</window>
</zk>
If you run the above by clicking the "Start" button, the "Processing..." message will appear for about 5 seconds. While that is running, you cannot click the Start button again.
Alternatively, you could simply set up your buttons to be automatically disabled - something like this:
<button id="ok" label="OK" autodisable="self" />
For more information on this approach, click here.
Hope that helps,
Todd
Clients.showBusy() seems to do what I want. But is there anyway to make it generally for the entire application? Everytime the application runs a process (when the progressbox appears without having to call Clients.showBusy()) the page must appears disabled. If not, I must call Clients.showBusy every time something is done?And do the echoEvent??
Thank you
Can these two threads help you?
http://www.zkoss.org/forum/listComment/13501-Processing-box-customisation
http://www.zkoss.org/forum/listComment/10981/
best
Stephan
Hi Neus,
it's possible to share the code with us?
thanks
Stephan
Of course.
<device-config>
<device-type>ajax</device-type>
<!-- Custom javascript snippets -->
<embed>
<![CDATA[
<script type="text/javascript">
zUtl.progressbox = function(id, msg, mask, icon) {
mask=true; //Ponemos este booleano a true para que el progressbox siempre aparezca como
//una ventana modal (con todos los componentes de abajo deshabilitados)
if (mask && zk.Page.contained.length) {
for (var c = zk.Page.contained.length, e = zk.Page.contained[--c]; e; e = zk.Page.contained[--c]) {
if (!e._applyMask)
e._applyMask = new zk.eff.Mask({
id: e.uuid + "-mask",
message: msg,
anchor: e.$n()
});
}
return;
}
if (mask)
zk.isBusy++;
var x = jq.innerX(), y = jq.innerY(),
style = ' style="left:'+x+'px;top:'+y+'px"',
idtxt = id + '-t',
idmsk = id + '-m',
html = '<div id="'+id+'"';
if (mask)
html += '><div id="' + idmsk + '" class="z-modal-mask"'+style+'></div';
html += '><div id="'+idtxt+'" class="z-loading"'+style
+'><div class="z-loading-indicator"><span class="z-loading-icon"></span> '
+msg+'</div></div>';
if (icon)
html += '<div class="' + icon + '"></div>';
jq(document.body).append(html + '</div>');
var $n = jq(id, zk),
n = $n[0],
$txt = jq(idtxt, zk);
if (mask)
n.z_mask = new zk.eff.FullMask({
mask: jq(idmsk, zk)[0],
zIndex: $txt.css('z-index') - 1
});
//center
var txt = $txt[0],
st = txt.style;
st.left = jq.px((jq.innerWidth() - txt.offsetWidth) / 2 + x);
st.top = jq.px((jq.innerHeight() - txt.offsetHeight) / 2 + y);
$n.zk.cleanVisibility();
}
</script>]]>
</embed>
</device-config>
Hi.
I'm using this code above to perfection in version 5.0.12 EE zk. However when trying to use it in ZK 6.5.1 EE does not work. I tried several times. I put alerts in the middle of the javascript to see if it went through or not (and yes it passes). But not with the same effect. How do I have all my screens with modal as in version 5? Only depend on it to migrate. I would not want to craete new events (echoEvent) in more than 300 forms. Is there any way to make it work in version 6?
thank you
Asked: 2011-11-16 11:51:15 +0800
Seen: 691 times
Last updated: Jan 14 '13
