Processing...

Suggested case list:

Using timer to refresh a grid

383guest172.69.33.12125nk0uiMay 7, 2020 7:23:47 AMlink

user model to move item to another listbox

120guest162.158.193.148d0n3krApr 2, 2020 5:28:28 AMlink

Disabled list item row passed to VM-1981

296fatih123160.83.36.13025nk0uiFeb 13, 2018 4:25:44 PMlink

Disabled list item row passed to VM-1981

295fatih123160.83.36.13025nk0uiFeb 13, 2018 4:25:16 PMlink

Disabled list item row passed to VM-1981

294fatih123160.83.36.13225nk0uiFeb 13, 2018 3:30:44 PMlink

grid sample with ListModel/RowRenderer

816guest80.82.2.1312vah9ajFeb 21, 2017 11:42:21 AMlink

grid sample with ListModel/RowRenderer

809guest175.98.113.1622vah9ajJan 26, 2017 9:19:33 AMlink

grid sample with ListModel/RowRenderer

196guest79.185.142.402vah9ajApr 26, 2014 10:53:57 PMlink

grid sample with ListModel/RowRenderer

195guest79.185.142.402vah9ajApr 26, 2014 10:53:54 PMlink

grid sample with ListModel/RowRenderer

194guest79.185.142.402vah9ajApr 26, 2014 10:53:51 PMlink

grid sample with ListModel/RowRenderer

193guest79.185.142.402vah9ajApr 26, 2014 10:53:48 PMlink

grid sample with ListModel/RowRenderer

192guest79.185.142.402vah9ajApr 26, 2014 10:53:44 PMlink

grid sample with ListModel/RowRenderer

191guest79.185.142.402vah9ajApr 26, 2014 10:53:40 PMlink

Hierarchy table without using ZK PE/EE

1aaknai151.28.135.2131s871daJul 29, 2013 11:02:46 PMlink

grid sample with ListModel/RowRenderer

128aaknai151.28.135.2132vah9ajJul 29, 2013 7:20:00 PMlink

user model to move item to another listbox

1TonyQ114.25.109.94d0n3krApr 21, 2012 10:43:27 AMlink

Using timer to refresh a grid

1TonyQ220.133.44.3725nk0uiFeb 17, 2012 3:17:34 AMlink

Fire a event from child iframe

1TonyQ220.133.44.372eupjotFeb 3, 2012 5:04:52 AMlink

Textbox input restriction sample

1TonyQ72.21.245.2431b3nlr0Dec 20, 2011 10:09:10 AMlink

Test web core taglib in ZUL

1TonyQ198.203.175.175ofqkemDec 17, 2011 3:36:08 AMlink

Latest 10 Fiddles :

Another new ZK fiddle

1guest172.70.111.155rcrbibApr 24, 2024 10:32:38 AMlink

open new url in same tab

16guest172.71.134.14923nk51gApr 23, 2024 3:42:54 PMlink

Dedalus Concerto CONC-5938

71guest188.114.102.11417kiilApr 23, 2024 1:10:17 PMlink

Dedalus Concerto CONC-XXXX

70guest172.71.246.317kiilApr 23, 2024 10:43:35 AMlink

Dedalus Concerto CONC-XXXX

69guest172.71.246.217kiilApr 23, 2024 10:42:44 AMlink

Dedalus Concerto CONC-XXXX

68guest172.71.246.4917kiilApr 23, 2024 10:40:09 AMlink

Scrapbook Concerto CONC-XXXX

67guest172.71.246.4817kiilApr 23, 2024 10:39:49 AMlink

Scrapbook Concerto CONC-XXXX

66guest172.71.246.4917kiilApr 23, 2024 10:39:35 AMlink

Scrapbook Concerto CONC-XXXX

65guest172.71.246.4917kiilApr 23, 2024 10:38:52 AMlink

Scrapbook Concerto CONC-XXXX

64guest172.71.246.4917kiilApr 23, 2024 10:38:47 AMlink

Progress

14guest14.176.232.861ti966rDec 3, 2019 2:25:17 AMlink

resources

index.zulzul<zk> <script src="upload.js"/> <window border="normal" title="hello" apply="pkg$.Controller"> <div id="anexo"/> </window> </zk> FileUpload.javajava import org.zkoss.util.media.Media; import org.zkoss.zk.ui.Executions; import org.zkoss.zk.ui.Sessions; import org.zkoss.zk.ui.event.Event; import org.zkoss.zk.ui.event.EventListener; import org.zkoss.zk.ui.event.UploadEvent; import org.zkoss.zul.A; import org.zkoss.zul.Button; import org.zkoss.zul.Div; import org.zkoss.zul.Hlayout; import org.zkoss.zul.Label; public class FileUpload extends Div { private Media media; /** * FileUploadPlus * */ public FileUpload() { initComponents(); } /** * @return Media */ public Media getMedia() { return media; } /** * @param media Media */ public void setMedia( Media value ) { this.media = value; } /** * addItem * * @param media Media */ private void addItem( Media media ) { getChildren().clear(); this.media = media; if ( media != null ) { if ( hlayout == null ) { hlayout = new Hlayout(); mediaLabel = new Label(); removeLink = new A(); hlayout.setSpacing( "6px" ); removeLink.setLabel( "Excluir" ); removeLink.setStyle( "color: #003876;" ); hlayout.appendChild( mediaLabel ); hlayout.appendChild( removeLink ); removeLink.addEventListener( org.zkoss.zk.ui.event.Events.ON_CLICK, new EventListener() { public void onEvent( Event event ) throws Exception { removeItem(); } } ); } mediaLabel.setValue( media.getName() ); appendChild( hlayout ); } else { appendChild( attachButton ); } } /** * removeItem * */ private void removeItem() { hlayout.detach(); addItem( null ); } /** * initComponents * */ private void initComponents() { attachButton.setLabel( "Anexar" ); attachButton.setUpload( "zk.UPMSample1,maxsize=10240" ); appendChild( attachButton ); attachButton.addEventListener( org.zkoss.zk.ui.event.Events.ON_UPLOAD, new EventListener() { public void onEvent( Event event ) throws Exception { Media[] local = ( (UploadEvent) event ).getMedias(); for ( Media m : local ) { addItem( m ); postEvent(); } } }); } private Button attachButton = new Button(); private Hlayout hlayout; private Label mediaLabel; private A removeLink; } Controller.javajavaimport org.zkoss.zk.ui.Component; import org.zkoss.zk.ui.Page; import org.zkoss.zk.ui.metainfo.ComponentInfo; import org.zkoss.zk.ui.util.GenericComposer; import org.zkoss.zul.Div; public class Controller extends GenericComposer { @Override public ComponentInfo doBeforeCompose( Page page, Component parent, ComponentInfo info ) { super.doBeforeCompose( page, parent, info ); return info; } @Override public void doAfterCompose( Component parent ) throws Exception { super.doAfterCompose( parent ); Div div = (Div) parent.getFellow( "attach" ); div.appendChild( fileUpload ); } private FileUpload fileUpload = new FileUpload(); } upload.jsjavascriptzk.afterMount(function() { //Upload Progress Monitor Sample 1 zk.UPMSample1 = zk.$extends(zk.Object, { updated : null, $init : function(uplder, filenm) { this._uplder = uplder; var id = uplder.id; //Add message and progressmeter zk.Widget.$(jq("$flist")).appendChild( new zul.box.Hlayout({ id: id + "_layout", spacing: "6px", sclass: "UPMSample1", children: [ new zul.wgt.Html({ content: ['<div class="msg"><span>', filenm,'</span></div>'].join("") }), new zul.wgt.Progressmeter({ id: id + "_pgs" })] }) ); }, update : function(sent, total) { zk.Widget.$(jq('$' + this._uplder.id + '_pgs')).setValue(sent); }, destroy : function() { var layout = jq('$' + this._uplder.id + "_layout"); if (zk.ie) { zk.Widget.$(layout).detach(); } else { layout.animate({ width: 1}, 500, function() { zk.Widget.$(layout).detach(); }); } } }); //Upload Progress Monitor Sample 2 zk.UPMSample2 = zk.$extends(zk.Object, { updated : null, $init : function(uplder, filenm) { this._uplder = uplder; var id = uplder.id, uri = '../widgets/effects/upload_effect/img/upload-loader.gif', html = ['<div id="', id,'" class="UPMSample2">', '<image class="float-left" src="' , uri, '"/>', '<div class="float-left">&nbsp;&nbsp;&nbsp;FileName: ', filenm , '</div>', '<div class="float-right">', msgzk.FILE_SIZE, '<span id="' , id, '-sent">0</span> of ', '<span id="' , id, '-total">0</span>', '<span id="' , id, '-percent"> (0%)</span>', '</div><div class="clear"></div></div>'].join(""); jq("$footer").append(html); this.viewer = jq('#' + id)[0]; }, update : function(sent, total) { jq('#' + this._uplder.id + '-sent').html(Math.round((total / 1024) * sent / 100) + msgzk.KBYTES); if (!this.updated) { this.updated = true; jq('#' + this._uplder.id + '-total').html(Math.round(total / 1024) + msgzk.KBYTES); } jq('#' + this._uplder.id + '-percent').html(" (" +sent + "%" + ")"); }, destroy : function() { jq(this.viewer).slideUp(1000); } }); });