Friday, 22 June 2012

MVVM Modal window–Pass Parameter and Return values

In this post, we will see how we can pass some values to the modal window when calling from the parent window and also vice versa (i.e) return some values from the modal window to parent window

 

Project Name : MVVMModalWindow
Project Structure:

image

Demo.zul

<?page title="new page title" contentType="text/html;charset=UTF-8"?>
<zk>
<window title="MVVM Modal window Passing arguments and retur values"
border="normal" apply="org.zkoss.bind.BindComposer"
viewModel="@id('e') @init('com.demo.UI.demoVM')">
Type any value and Press the Model Window Button
<separator />
Value 1 :
<textbox value="@bind(e.value1)" />
Value 2 :
<textbox value="@bind(e.value2)" />
<button label="Model Window" onClick="@command('showModelWin')" />
</window>
</zk>

 

demoVM.java

 

package com.demo.UI;

import java.util.HashMap;

import org.zkoss.bind.annotation.BindingParam;
import org.zkoss.bind.annotation.Command;
import org.zkoss.bind.annotation.GlobalCommand;
import org.zkoss.zk.ui.Executions;
import org.zkoss.bind.annotation.NotifyChange;

public class demoVM {

private String value1;
private String value2;


public String getValue1() {
return value1;
}

public void setValue1(String value1) {
this.value1 = value1;
}

public String getValue2() {
return value2;
}

public void setValue2(String value2) {
this.value2 = value2;
}

@Command
public void showModelWin()
{
final HashMap<String, Object> map = new HashMap<String, Object>();
map.put("value1", this.value1 );
map.put("value2", this.value2);
Executions.createComponents("ModelWindow.zul", null, map);
}

@GlobalCommand
@NotifyChange({"value1","value2"})
public void refreshvalues(@BindingParam("returnvalue1") String str1, @BindingParam("returnvalue2") String str2)
{
this.value1 = str1;
this.value2 = str2;
}
}


ModelWindow.zul

<?page title="new page title" contentType="text/html;charset=UTF-8"?>
<zk>

<window id="modalDialog"
title="MVVM Modal window Passing arguments and retur values"
width="420px" height="auto" border="normal" minimizable="false"
mode="modal" maximizable="false" closable="true"
action="hide: slideUp" apply="org.zkoss.bind.BindComposer"
onCancel="@command('closeThis')"
viewModel="@id('e') @init('com.demo.UI.ModelWindowVM')">

Change the values and Press the Ok Button to return changed
values.
<separator />
Value 1 :
<textbox value="@bind(e.value1)" />
Value 2 :
<textbox value="@bind(e.value2)" />
<button label="Ok" onClick="@command('save')" />
</window>
</zk>


ModelWindowVM.java

 


package com.demo.UI;

import org.zkoss.bind.annotation.Command;
import org.zkoss.bind.annotation.ContextParam;
import org.zkoss.bind.annotation.ContextType;
import org.zkoss.bind.annotation.ExecutionArgParam;
import org.zkoss.bind.annotation.Init;
import org.zkoss.zk.ui.Component;
import org.zkoss.zk.ui.select.Selectors;
import org.zkoss.zk.ui.select.annotation.Wire;
import org.zkoss.zul.Window;
import java.util.HashMap;
import org.zkoss.bind.BindUtils;
import java.util.Map;

public class ModelWindowVM {

@Wire("#modalDialog")
private Window win;
private String value1;
private String value2;


public String getValue1() {
return value1;
}

public void setValue1(String value1) {
this.value1 = value1;
}

public String getValue2() {
return value2;
}

public void setValue2(String value2) {
this.value2 = value2;
}

@Init
public void init(@ContextParam(ContextType.VIEW) Component view,
@ExecutionArgParam("value1") String v1,
@ExecutionArgParam("value2") String v2) {
Selectors.wireComponents(view, this, false);
this.value1 = v1;
this.value2 = v2;

}

@SuppressWarnings({ "unchecked", "rawtypes" })
@Command
public void save() {
Map args = new HashMap();
args.put("returnvalue1", this.value1);
args.put("returnvalue2", this.value2);
BindUtils.postGlobalCommand(null, null, "refreshvalues", args);
win.detach();
}

@Command
public void closeThis() {
win.detach();
}
}


Now you can run the demo.zul file

9 comments:

  1. Hi, since zk 6.0.2, to wire component in a view model, you have to use new @AfterCompose annotation,
    please read upgrade note : http://books.zkoss.org/wiki/Small_Talks/2011/November/ZK_6:_Upgrade_Notes#ZK_Bind_Since_6.0.2

    ReplyDelete
  2. Your blog is great help and thanks for sharing your knowledge with the development community.
    Have a wonderful life and keep sharing.

    ReplyDelete
    Replies
    1. Thank you. More examples http://emrpmsexpert.com:8080/ZKExamples/

      Delete
    2. Thank you Senthil, your work and blog is great!!! Only here i see real useful MVVM examples.

      Delete
  3. Thanks for this example ! Way more usefull that the current documentation of ZK

    ReplyDelete
  4. I’m not that much of a online reader to be honest but your sites really nice,
    keep it up! I'll go ahead and bookmark your website to come back down the
    road. Many thanks

    Visit my weblog; das perfekte Laptop Business - Nebenjob Von Zuhause

    ReplyDelete
  5. very easy to understand than the example code in another blog , thank you for sharing your knowledge , this really helped me

    ReplyDelete
  6. If we are searching some thing in which we are expecting to to get effective of use full knowledge than we will surely go to the on this article and blogs. your blog is effective for the detail search for me. Thank you such a blod post.
    Visit: Webworker24

    ReplyDelete
  7. We are a third party technical support service. Avast Customer Support is here to help you out with the whole procedure to Download Avast Antivirus online, We not only fix your Avast Support related issues but will guide with how to get started with your new Avast product once it gets installed successfully. Call on our Toll Free no. 1 855 966 3855
    Gmail Customer service is a third party technical support service for Gmail users when they face any technical issue or error in their Gmail account. Our Gmail Customer Support team solves issues like forgot Gmail account password, Gmail configuration or Sync issues, recover deleted emails and many more. Toll Free number (800) 986-9271
    How you install or reinstall Office 365 or Office 2016 depends on whether your Office product is part of an Office for home or Office for business plan. If you're not sure what you have, see what office com setup products are included in each plan and then follow the steps for your product. The steps below also apply if you're installing a single, stand-alone Office application such as Access 2016 or Visio 2016. Need Help with office setup Enter Product Key? Call 1-800-000-0000 Toll Free
    Norton Tech Support is a third party service provider and not in any way associated with Norton or any of its partner companies. We offer support for Norton products and sell subscription based additional warranty on computer and other peripheral devices. Call our Toll Free number 1 855 966 3855
    Other Services
    Norton Toll Free , Office-Setup , office.com/setup.

    ReplyDelete