没有拖放事件的列表框的 ZK 重新排序 [英] ZK Reordering With Listbox Without Drag And Drop Event
问题描述
因为我正在尝试这个示例由 Nabil Abdel-Hafeez
定义它在一些小问题上运行良好，我已经在跟踪器中作为问题提到了这些问题.但是我想打开一个 DualBox 模态窗口，其中一个列表框包含所有标题名称，另一个列表框将包含我们要为列表框显示的标题(我用 getitemrendered 做到了这一点).我想使用相同的 ZUL 代码而没有getitemrendered 方法.但是用户可以隐藏他/她不想看到的列表框的标题.有人做过这种类型的事情吗?这里
带有 + 符号的绿色图像显示了我想要实现的相同内容.
因为我正在尝试 Nabil Abdel-Hafeez，但我的问题是我将提供双列表框，用户可以在其中选择他/她希望在列表框中看到的标题，用户可以通过单击选择标题在按钮上，用户可以从 duallistbox 添加一个标题或所有标题，当用户单击 duallistbox 的重新排序按钮时，它将重新排序.在 Nabil 演示中，他正在做这样的事情..
for (Listitem item : lHead.getListbox().getItems()) {item.insertBefore(item.getChildren().get(from), item.getChildren().get(to));}但是如果用户选择多个，我们将跟踪哪个先出现哪个第二个等等..
你可以尝试将 MVVM 与 forEach 结合起来，这样你就可以构造 String 数组来显示，这从 6.0.2 开始有效
例如
zul
<div apply="org.zkoss.bind.BindComposer"viewModel="@id('vm') @init('test.TestVM')"><listbox model="@load(vm.model)"><列表头><listheader forEach="${vm.headers}" label="${each}"/></listhead><模板名称="模型" var="单元格"><列表项><listcell forEach="${cells}" label="${each}"/></listitem></列表框><button label="original seq" onClick="@command('originalSeq')"/><button label="reverse" onClick="@command('reverse')"/> </zk>
虚拟机
包测试；导入 org.zkoss.bind.annotation.Command;导入 org.zkoss.bind.annotation.NotifyChange;导入 org.zkoss.zul.ListModel;导入 org.zkoss.zul.ListModelList;导入 java.util.*;公共类 TestVM {私有 int[] _original = {1, 2, 3};私有 int[] _reverse = {3, 2, 1};私有 int[] _seq = _original;私人列表_rawData;公共字符串[] getHeaders() {String[] headers = new String[_seq.length];for (int i = 0; i < _seq.length; i++) {int idx = _seq[i];headers[i] = (idx == 1?名字":idx == 2?姓" :idx == 3?年龄" : "");}返回标题；}公共 ListModel getModel() {如果(_rawData == null){getRawData();}列表模型数据 = new ArrayList();for (int i = 0; i < _rawData.size(); i++) {人员数据 = (Person)_rawData.get(i);String[] cells = new String[_seq.length];for (int j = 0; j <_seq.length; j++) {单元格[j] = data.getValue(_seq[j]);}模型数据.添加(单元格)；}返回新的 ListModelList(modelData);}公共无效getRawData(){_rawData = new ArrayList();_rawData.add(new Person("First Name 01", "Last Name 01", 21));_rawData.add(new Person("First Name 02", "Last Name 02", 22));_rawData.add(new Person("First Name 03", "Last Name 03", 23));}@命令@NotifyChange("模型")公共无效原序列(){_seq = _original;}@命令@NotifyChange("模型")公共无效反向(){_seq = _reverse;}类人{私人字符串_firstName;私人字符串_lastName;私人 int _age;公共人(字符串名字，字符串姓氏，整数年龄){_firstName = 名字；_lastName = 姓氏；_age = 年龄；}公共字符串getFirstName(){返回_名；}公共字符串getLastName(){返回_姓氏；}公共 int getAge() {返回_年龄；}公共字符串 getValue (int i) {返回 i == 1?获取名字():我==2?getLastName() :我= 3?getAge() + "" : "";}}}关于forEach，请参考ZK迭代评估
编辑
在 ZK fiddle 上完全绑定的样本
As i am trying This example well define by Nabil Abdel-Hafeez
It is working fine with some small issue which i already mentioned in tracker as issue. But i will want to Open a DualBox modal window in which one listbox contain all header name and other listbox will contain which header we will want to show for a listbox(I did this with getitemrendered ).I will want to use same ZUL Code without getitemrendered method.But user can hide the header which he/she do not want to see for a listbox. Anyone did this type of things? Here
The green image with + Sign showing same thing which i will want to implement.
As I was trying the Nabil Abdel-Hafeez but my issue is that i will provide duallistbox where user can select which header he/she will want to see in listbox, user can select header by clicking on button ,user can add one header or all header from duallistbox and when user click on the Reorder button of duallistbox then it will reorder .In Nabil demo he is doing something like this..
for (Listitem item : lHead.getListbox().getItems()) {
item.insertBefore(item.getChildren().get(from), item.getChildren().get(to));
}
But if user selecting multiple how we will track which will come first which second and so on..
You can try combine MVVM with forEach so you can construct String array to display, this works since 6.0.2
e.g.,
zul
<zk>
<div apply="org.zkoss.bind.BindComposer"
viewModel="@id('vm') @init('test.TestVM')">
<listbox model="@load(vm.model)">
<listhead>
<listheader forEach="${vm.headers}" label="${each}" />
</listhead>
<template name="model" var="cells">
<listitem>
<listcell forEach="${cells}" label="${each}" />
</listitem>
</template>
</listbox>
<button label="original seq" onClick="@command('originalSeq')" />
<button label="reverse" onClick="@command('reverse')" />
</div>
</zk>
VM
package test;
import org.zkoss.bind.annotation.Command;
import org.zkoss.bind.annotation.NotifyChange;
import org.zkoss.zul.ListModel;
import org.zkoss.zul.ListModelList;
import java.util.*;
public class TestVM {
private int[] _original = {1, 2, 3};
private int[] _reverse = {3, 2, 1};
private int[] _seq = _original;
private List _rawData;
public String[] getHeaders () {
String[] headers = new String[_seq.length];
for (int i = 0; i < _seq.length; i++) {
int idx = _seq[i];
headers[i] = (idx == 1? "First Name" :
idx == 2? "Last Name" :
idx == 3? "Age" : "");
}
return headers;
}
public ListModel getModel () {
if (_rawData == null) {
getRawData();
}
List modelData = new ArrayList();
for (int i = 0; i < _rawData.size(); i++) {
Person data = (Person)_rawData.get(i);
String[] cells = new String[_seq.length];
for (int j = 0; j < _seq.length; j++) {
cells[j] = data.getValue(_seq[j]);
}
modelData.add(cells);
}
return new ListModelList(modelData);
}
public void getRawData () {
_rawData = new ArrayList();
_rawData.add(new Person("First Name 01", "Last Name 01", 21));
_rawData.add(new Person("First Name 02", "Last Name 02", 22));
_rawData.add(new Person("First Name 03", "Last Name 03", 23));
}
@Command
@NotifyChange("model")
public void originalSeq () {
_seq = _original;
}
@Command
@NotifyChange("model")
public void reverse () {
_seq = _reverse;
}
class Person {
private String _firstName;
private String _lastName;
private int _age;
public Person (String firstName, String lastName, int age) {
_firstName = firstName;
_lastName = lastName;
_age = age;
}
public String getFirstName () {
return _firstName;
}
public String getLastName () {
return _lastName;
}
public int getAge () {
return _age;
}
public String getValue (int i) {
return i == 1? getFirstName() :
i == 2? getLastName() :
i == 3? getAge() + "" : "";
}
}
}
Regarding forEach, please refer to ZK Iterative Evaluation
Edit
Fully binded sample at ZK fiddle
这篇关于没有拖放事件的列表框的 ZK 重新排序的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
