Question

我有一个从视图动态生成的列表。单击该按钮时，会添加一个新行，输入并保存该值。

.zul

<zk>
    <window border="normal" title="hello" viewModel="@id('vm') @init('gemalto.CreateServiceVersion')" apply="org.zkoss.bind.BindComposer">

        <grid id="demoGrid"
              model="@load(vm.profileList) @template((each.editingStatus) ? 'editable' : 'noneditable')">
            <columns sizable="true">
                <column width="160px" >Value</column>
                <column width="160px" ></column>
            </columns>
            <rows>
                <template name="editable">
                    <row>
                        <textbox id="valueTextBox"
                                 value="@load(each.serviceProfile.valueVariable) @save(each.serviceProfile.valueVariable, before='confirm')" />
                        <button
                            image="/img/save.png" label="save"
                            onClick="@command('confirm', currentVariable=each)"/>
                    </row>
                </template> 
                <template name="noneditable">
                    <row>
                        <label value="@load(each.serviceProfile.valueVariable)" />
                    </row>
                </template>
            </rows>


        </grid> 

        <div align="center">
            <button label="Add" image="/img/create.png" onClick="@command('onAddNew')" />
        </div>

    </window>
</zk>

查看模型

public class CreateServiceVersion extends SelectorComposer<Component> {

    private boolean isEditing = false;
    private boolean displayEdit = true;
    private boolean isAddNew = false;
    private List<ServiceProfileStatus> profileList = new ArrayList<ServiceProfileStatus>();

    public List<ServiceProfileStatus> getProfileList() {
        return profileList;
    }

    @AfterCompose
    public void afterCompose() {
        profileList.add(new ServiceProfileStatus(new ServiceProfile("value1"), false));
        profileList.add(new ServiceProfileStatus(new ServiceProfile("value2"), false));
    }

    @Command
    public void CrudServiceVersion() {
        Executions.sendRedirect("CrudServiceVersion.zul");
    }

    @Command
    @NotifyChange({"profileList"})
    public void onAddNew() {
        if (!isEditing) {
            ServiceProfileStatus sps = new ServiceProfileStatus(new ServiceProfile(""), displayEdit);
            profileList.add(0, sps);
            isAddNew = true;
            isEditing = true;
        }
    }

    @Command
    public void confirm(@BindingParam("currentVariable") ServiceProfileStatus sps) {
        isEditing = false;
        isAddNew = false;
        sps.setEditingStatus(isEditing);
        BindUtils.postNotifyChange(null,null,sps,"*");
    }
}

问题是我添加了一个新项目，该值被复制到所有其他项目。

我把图像更清楚地看到发生了什么。

imgur.com/7u7OkPG
imgur.com/mf8PUYI
imgur.com/aJpNoXM

Answer 1

我测试了你的代码，它与我一起工作。
现在我稍微更改了代码：

从视图模型中删除extends SelectorComposer因为MVVM不需要。
将2个模板更改为1个模板。
在zul中的viewmodel中使用布尔值。

祖尔：

<?xml version="1.0" encoding="UTF-8"?>
<zk>
    <window border="normal" title="hello" viewModel="@id('vm') @init('be.chillworld.CreateServiceVersion')" apply="org.zkoss.bind.BindComposer">
        <grid id="demoGrid" model="@load(vm.profileList)">
            <columns sizable="true">
                <column width="160px" >Value</column>
                <column width="160px" ></column>
            </columns>
            <rows>
                <template name="model">
                    <row>
                        <textbox value="@load(each.serviceProfile.valueVariable) @save(each.serviceProfile.valueVariable, before='confirm')" />
                        <button disabled="@load(not each.editingStatus)" visible="@load(each.editingStatus)" image="/img/save.png" label="save"
                            onClick="@command('confirm', currentVariable=each)"/>
                    </row>
                </template>
            </rows>
        </grid> 
        <div align="center">
            <button disabled="@load(vm.mayCreateNew)" label="Add" image="/img/create.png" onClick="@command('onAddNew')" />
        </div>

    </window>
</zk>

Viewmodel：

package be.chillworld;

import java.util.ArrayList;
import java.util.List;
import org.zkoss.bind.BindUtils;
import org.zkoss.bind.annotation.AfterCompose;
import org.zkoss.bind.annotation.BindingParam;
import org.zkoss.bind.annotation.Command;
import org.zkoss.bind.annotation.NotifyChange;
import org.zkoss.zk.ui.Executions;

/**
 *
 * @author chillworld     */
public class CreateServiceVersion {

    private boolean isEditing = false;
    private List<ServiceProfileStatus> profileList = new ArrayList<ServiceProfileStatus>();

    public List<ServiceProfileStatus> getProfileList() {
        return profileList;
    }

    @AfterCompose
    public void afterCompose() {
        profileList.add(new ServiceProfileStatus(new ServiceProfile("value1"), false));
        profileList.add(new ServiceProfileStatus(new ServiceProfile("value2"), false));
    }

    @Command
    public void CrudServiceVersion() {
        Executions.sendRedirect("CrudServiceVersion.zul");
    }

    @Command
    @NotifyChange({"profileList","mayCreateNew"})
    public void onAddNew() {
        isEditing = true;
        ServiceProfileStatus sps = new ServiceProfileStatus(new ServiceProfile(""), true);
        profileList.add(0, sps);
    }

    @Command
    @NotifyChange("mayCreateNew")
    public void confirm(@BindingParam("currentVariable") ServiceProfileStatus sps) {
        isEditing = false;
        sps.setEditingStatus(isEditing);
        BindUtils.postNotifyChange(null, null, sps, "*");
    }

    public boolean getMayCreateNew() {
        return isEditing;
    }
}

ServiceProfileStatus.java：

package be.chillworld;

/**
 *
 * @author chillworld
 */
public class ServiceProfileStatus {

    private ServiceProfile serviceProfile;
    private boolean editingStatus;

    public ServiceProfileStatus(ServiceProfile serviceProfile, boolean editingStatus) {
        this.serviceProfile = serviceProfile;
        this.editingStatus = editingStatus;
    }

    public boolean isEditingStatus() {
        return editingStatus;
    }

    public void setEditingStatus(boolean editingStatus) {
        this.editingStatus = editingStatus;
    }

    public ServiceProfile getServiceProfile() {
        return serviceProfile;
    }

    public void setServiceProfile(ServiceProfile serviceProfile) {
        this.serviceProfile = serviceProfile;
    }

    public ServiceProfileStatus(ServiceProfile serviceProfile) {
        this.serviceProfile = serviceProfile;
    }
}

ServiceProfile.java：

package be.chillworld;

/**
 *
 * @author chillworld
 */
public class ServiceProfile {

    private String valueVariable;

    public ServiceProfile(String valueVariable) {
        this.valueVariable = valueVariable;
    }

    public String getValueVariable() {
        return valueVariable;
    }

    public void setValueVariable(String valueVariable) {
        this.valueVariable = valueVariable;
    }
}

在网格ZK中显示和修改列表

1 个答案:

祖尔：

Viewmodel：

ServiceProfileStatus.java：

ServiceProfile.java：