Modal Windows"

From Documentation
(Created page with 'This section describes the notes when using the Servlet thread to process the event (the default). === Modal Windows === You can not use the modal window anymore. You can create…')
 
(11 intermediate revisions by 4 users not shown)
Line 1: Line 1:
−
This section describes the notes when using the Servlet thread to process the event (the default).
+
{{ZKDevelopersReferencePageHeader}}
  
−
=== Modal Windows ===
+
= Modal Windows with Servlet Thread =
−
You can not use the modal window anymore. You can create the same visual effect with the highlighted mode. However, at the server side, it works just like the overlapped mode – it returns immediately without waiting for user's response.
+
 
 +
When the event is processed in the Servlet thread (default), the execution cannot be suspended. Thus, the modal window behaves the same as the highlited window (<javadoc method="doHighlighted()">org.zkoss.zul.Window</javadoc>). At the client side, the visual effect is the same: a semi-transparent mask blocks the end user from access components other than the modal window. However, at the server side, it works just like the overlapped mode – it returns immediately without waiting for user's closing the window.
  
 
<source lang="java" >
 
<source lang="java" >
−
  win.doHighlighted(); //returns once the mode is changed; not suspended
+
  win.doModal(); //returns once the mode is changed; not suspended
 +
System.out.println("next");
 
</source>
 
</source>
−
 
−
=== Message Boxes ===
 
−
The message boxes returns immediately so it always returns <tt>Messagebox.OK</tt>. Thus, it is meaningless to show buttons other than the OK button. For example, the <tt>if</tt> clause in the following example is never true.
 
  
 +
The "next" message will be printed to the console before the end user closes the modal window.
 +
 +
== Migrate Your Code from Event Thread ==
 +
 +
With the Event thread, you might write your business logic right after <tt>doModal()</tt>.
 
<source lang="java" >
 
<source lang="java" >
−
if (Messagebox.show("Delete?", "Prompt", Messagebox.YES|Messagebox.NO,
+
win.doModal();
−
    Messagebox.QUESTION) == Messagebox.YES) {
+
doMyTask(); //your business logic, need to move it for a servlet thread
−
    this_never_executes();
 
−
}
 
 
</source>
 
</source>
−
 
−
Rather, you have to provide an event listener as follows.
 
  
−
<source lang="java" >
+
Since now servlet thread doesn't stop at <tt>doModal()</tt>, you need to move your code to another place. You can put it at:
−
Messagebox.show("Delete?", "Prompt", Messagebox.YES|Messagebox.NO,
+
 
−
    Messagebox.QUESTION,
+
* Window's <tt>onClose</tt> event listener
−
    new EventListener() {
+
* add a button in the modal window and call <tt>doMyTask()</tt> in an <tt>onClick</tt> listener and close the modal window.
−
        public void onEvent(Event evt) {
 
−
            switch (((Integer)evt.getData()).intValue()) {
 
−
            case Messagebox.YES: doYes(); break; //the Yes button is pressed
 
−
            case Messagebox.NO: doNo(); break; //the No button is pressed
 
−
            }
 
−
        }
 
−
    }
 
−
);
 
−
</source>
 
−
 
−
The event listener you provided is invoked when the user clicks one of the buttons. Then, you can identify which button is clicked by examining the data (Event's <tt>getData</tt>). The data is an integer whose value is the button's identifier, such as <tt>Messagebox.YES</tt>.
 
  
−
Alternatively, you can examine the event name:
+
= Modal Windows with Event Thread =
  
−
<source lang="java" >
+
If the event thread is enabled, <javadoc method="doModal()">org.zkoss.zul.Window</javadoc> will suspend the current thread. Thus, the "next" message won't be shown, until the modal window is closed.
−
public void onEvent(Event evt) {
 
−
    if ("onYes".equals(evt.getName())) {
 
−
        doYes(); //the Yes button is pressed
 
−
    } else if ("onNo".equals(evt.getName())) {
 
−
        doNo(); //the No button is pressed
 
−
    }
 
−
}
 
−
</source>
 
−
 
−
'''Note''': The event name for the OK button is <tt>onOK</tt>, not <tt>onOk</tt>.
 
  
−
=== File Upload ===
+
When the event thread is suspended, the Servlet thread will be resumed and continue to loork another event thread to process other events, if any. Thus, the end user still have the control (such that he can close the modal window if he want).
−
The file upload dialog is no longer applicable. Rather, you shall use <javadoc>org.zkoss.zul.Button</javadoc> or <javadoc>org.zkoss.zul.Toolbarbutton</javadoc> with upload="true" instead. For example,
 
  
−
<source lang="xml">
+
=Version History=
−
<zk>
+
{{LastUpdated}}
−
<zscript>
+
{| border='1px' | width="100%"
−
void upload(Event event) {
+
! Version !! Date !! Content
−
org.zkoss.util.media.Media media = event.getMedia();
+
|-
−
if (media instanceof org.zkoss.image.Image) {
+
| &nbsp;
−
org.zkoss.zul.Image image = new org.zkoss.zul.Image();
+
| &nbsp;
−
image.setContent(media);
+
| &nbsp;
−
image.setParent(pics);
+
|}
−
} else {
 
−
Messagebox.show("Not an image: "+media, "Error", Messagebox.OK, Messagebox.ERROR);
 
−
break; //not to show too many errors
 
−
}
 
−
}
 
−
</zscript>
 
−
<button label="Upload" upload="true" onUpload="upload(event)"/>
 
−
<toolbarbutton label="Upload" upload="true" onUpload="upload(event)"/>
 
−
<vbox id="pics" />
 
−
</zk>
 
−
</source>
 
  
−
If you prefer to use a dialog (<javadoc method="get()">org.zkoss.zul.Fileupload</javadoc>), please take a look at [[ZK_Component_Reference/Essential_Components/Fileupload | ZK Component Reference: Fileupload]] for more inormation.
+
{{ZKDevelopersReferencePageFooter}}

Revision as of 04:27, 18 April 2019


DocumentationZK Developer's ReferenceUI PatternsEvent ThreadsModal Windows
Modal Windows


Modal Windows with Servlet Thread

When the event is processed in the Servlet thread (default), the execution cannot be suspended. Thus, the modal window behaves the same as the highlited window (Window.doHighlighted()). At the client side, the visual effect is the same: a semi-transparent mask blocks the end user from access components other than the modal window. However, at the server side, it works just like the overlapped mode – it returns immediately without waiting for user's closing the window. 

 win.doModal(); //returns once the mode is changed; not suspended
 System.out.println("next");

The "next" message will be printed to the console before the end user closes the modal window.

Migrate Your Code from Event Thread

With the Event thread, you might write your business logic right after doModal(). 

win.doModal(); 
doMyTask(); //your business logic, need to move it for a servlet thread

Since now servlet thread doesn't stop at doModal(), you need to move your code to another place. You can put it at:

  • Window's onClose event listener
  • add a button in the modal window and call doMyTask() in an onClick listener and close the modal window.

Modal Windows with Event Thread

If the event thread is enabled, Window.doModal() will suspend the current thread. Thus, the "next" message won't be shown, until the modal window is closed.

When the event thread is suspended, the Servlet thread will be resumed and continue to loork another event thread to process other events, if any. Thus, the end user still have the control (such that he can close the modal window if he want).

Version History

Last Update : 2019/04/18


Version Date Content
     



Last Update : 2019/04/18

Copyright © Potix Corporation. This article is licensed under GNU Free Documentation License.


Retrieved from "https://www.zkoss.org/_w/index.php?title=ZK_Developer%27s_Reference/UI_Patterns/Event_Threads/Modal_Windows&oldid=48771"