Tuesday, 16 October 2012

ZK MVVM CRUD Without DB Connection - Part 3

        

In Part 2,
we have seen how we can change the look and Feel of the Listing records. Now we will design new form to add new customers

Project Structure

image

First let us add new zul file called as CustomerCRUD.zul under webcontent folder. The code is as follows

<?page title="new page title" contentType="text/html;charset=UTF-8"?>
<zk>
<window title="Customer CRUD" border="normal" id="CustomerCRUD"
width="430px" height="auto" apply="org.zkoss.bind.BindComposer"
minimizable="false" mode="modal" maximizable="false" closable="true"
position="center"
viewModel="@id('vm') @init('appVM.CustomerCRUDVM')">
<separator />
<label value="Customer information" />
<separator />
<panel width="100%">
<panelchildren>
<separator />
<grid width="99.5%">
<columns>
<column label="" width="150px" />
<column label="" />
</columns>
<rows>
<row>
<hbox>
<label value="First Name" />
</hbox>
<textbox name="firstName"
value="@bind(vm.selectedCustomer.firstName)" cols="20" />
</row>
<row>
<hbox>
<label value="Last Name" />
</hbox>
<textbox name="LastName"
value="@bind(vm.selectedCustomer.lastName)" cols="20" />
</row>
<row>
<hbox>
<label value="Email" />
</hbox>
<textbox name="firstName"
value="@bind(vm.selectedCustomer.email)" cols="20" />
</row>
</rows>
</grid>
</panelchildren>
</panel>
<separator />
<div align="center">
<button id="submit" label="Submit"
onClick="@command('save')" />
<button id="cancel" label="Cancel"
onClick="@command('closeThis')" />
</div>
</window>
</zk>


Next we will add another ViewModel called as CustomerCRUDVM.java under the package appVM. Here is the code.

package appVM;

import java.util.HashMap;
import java.util.Map;
import org.zkoss.bind.BindUtils;
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 domain.Customer;

public class CustomerCRUDVM { /*
* * This is the window ID used in CustomerCRUD.Zul
* File. Using this only, we * can close the model
* window after save and cancel button
*/
@Wire("#CustomerCRUD")
private Window win;
private Customer selectedCustomer;
private String recordMode;

public String getRecordMode() {
return recordMode;
}

public void setRecordMode(String recordMode) {
this.recordMode = recordMode;
}

public Customer getSelectedCustomer() {
return selectedCustomer;
}

public void setSelectedCustomer(Customer selectedCustomer) {
this.selectedCustomer = selectedCustomer;
}

@Init
public void initSetup(@ContextParam(ContextType.VIEW) Component view,
@ExecutionArgParam("sCustomer") Customer c1,
@ExecutionArgParam("recordMode") String recordMode) {
Selectors.wireComponents(view, this, false);
setRecordMode(recordMode);
if (recordMode.equals("NEW")) {
this.selectedCustomer = new Customer();
}
}

@SuppressWarnings({ "rawtypes", "unchecked" })
@Command
public void save() {
Map args = new HashMap();
args.put("pCustomer", this.selectedCustomer);
args.put("recordMode", this.recordMode);
BindUtils.postGlobalCommand(null, null, "updateCustomerList", args);
win.detach();
}

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

Next we will modify our existing CustomerListVM.java to take care of add new customer and update listing records. The code as follows


package appVM;

import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;
import org.zkoss.bind.annotation.BindingParam;
import org.zkoss.bind.annotation.Command;
import org.zkoss.bind.annotation.GlobalCommand;
import org.zkoss.bind.annotation.Init;
import org.zkoss.bind.annotation.NotifyChange;
import org.zkoss.zk.ui.Executions;
import org.zkoss.zul.Messagebox;
import domain.Customer;
import appData.CustomerData;

public class CustomerListVM {
private List<Customer> customerList = new ArrayList<Customer>();
private Customer curSelectedCustomer;

public Customer getCurSelectedCustomer() {
return curSelectedCustomer;
}

public void setCurSelectedCustomer(Customer curSelectedCustomer) {
this.curSelectedCustomer = curSelectedCustomer;
}

@Init
public void initSetup() {
customerList = new CustomerData().getAllCustomers();
}

public List<Customer> getallCustomers() {
return customerList;
}

@Command
public void addNewCustomer() {
final HashMap<String, Object> map = new HashMap<String, Object>();
map.put("sCustomer", null);
map.put("recordMode", "NEW");
Executions.createComponents("CustomerCRUD.zul", null, map);
}

@Command
public void editThisCustomer() {
Messagebox.show("Edit Existing Customer Code goes here");
} // The following method will be called from CustomerCRUDVM after the save
// // When we say
// Notifychange("allcustomers), then ZUL list items will be // updated @GlobalCommand @NotifyChange("allCustomers") public void updateCustomerList(@BindingParam("pCustomer") Customer cust1, @BindingParam("recordMode") String recordMode) { if (recordMode.equals("NEW")) { customerList.add(cust1); } } @Command public void deleteThisCustomer() { Messagebox.show("Delete
// Existing Customer Code goes here"); }}
}

Now again you can run customerList.zul file and Click add Customer.

image



         



Download Source code

1 comment:

  1. 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