problem to print modal window

asked 2014-07-17 20:25:55 +0800

louisa gravatar image louisa
2 1

Hello everyone

I have problems when trying to print a modal window which is in a zul file named preview.zul

In the parent controller I have the following code that calls the modal window

Window window = (Window) Executions.createComponents("/app/preview.zul", null, previewParams); window.doModal();

and the in preview.zul file containing this window that I want to print , I put the instruction :

<button id="btnTestPrint" label="Test print"/>

And finally in the preview controller, preview.java, I added:

***public void onClick$btnTestPrint() {

The problem is that instead of printing only the content of the modal window, It also prints the parent window which is displayed behind

Could someone please show me how to print only the content of my preview.zul file and nothing else?

Thank you

delete flag offensive retag edit

2 Answers

Sort by ยป oldest newest most voted

answered 2014-07-18 02:30:01 +0800

cor3000 gravatar image cor3000
4332 1 7
ZK Team

you can add a print style to your page e.g.:

<style media="print">
    body > *:not(.printable) {
        display: none !important;
    .printable {
        top: 0 !important;
        left: 0 !important;

<window title="myModal" mode="modal" sizable="true" width="500px"
        sclass="printable" ...

and then apply the sclass="printable" only to the modal dialog to print, the style will also move it to the top left, so that no printing space is wasted (optional). Any other root element on the page will be made invisible.

I hope this helps,


link publish delete flag offensive edit


Hi Robert, I'm working with Louisa and your solution is working. Thanks !

rgravel ( 2014-07-21 14:29:50 +0800 )edit

thanks for getting back, can you mark the answer as helpful so that other users find it more easy, in case they are searching for the same issue?

cor3000 ( 2014-07-22 03:36:23 +0800 )edit

answered 2014-07-18 19:49:05 +0800

louisa gravatar image louisa
2 1

Hello Thank you Robert for your answer Unfortunately it didn't work :-( I did it in many ways, either by putting the style mentionned in your post in the parent window, or by putting it in the common stylesheet of the whole application this way: @media print { body > *:not(.printable) {
display: none !important;
.printable {
top: 0 !important; left: 0 !important;
} }

But in both cases, it still prints the window in the background and on top of it the modal window...as if it prints all the windows displayed on the screen one on the other ..... Still need help please Thanks again!

link publish delete flag offensive edit


I tried the same with @media, and didn't get it to work, however the <style media="print"> worked more reliable for me

cor3000 ( 2014-07-22 03:39:11 +0800 )edit

Indeed, after some ajustments in our code, your solution worked Robert...thank you so much

louisa ( 2014-10-28 17:38:34 +0800 )edit
Your answer
Please start posting your answer anonymously - your answer will be saved within the current session and published after you log in or create a new account. Please try to give a substantial answer, for discussions, please use comments and please do remember to vote (after you log in)!

[hide preview]

Question tools

1 follower



Asked: 2014-07-17 20:25:55 +0800

Seen: 30 times

Last updated: Jul 18 '14

Support Options
  • Email Support
  • Training
  • Consulting
  • Outsourcing
Learn More