java - 在 WLISTBOX ZK 中选择行时如何设置单元格可编辑？

Question

当在 ZK 框架的 WLISTBOX 中选择行时，我想使特定的单元格可编辑？

Answer 1

因为没有答案你想要它 MVVM 或 MVC 我决定去 MVVM。

这是一个工作小提琴。
我在此处粘贴最重要的代码，以说明链接何时不再起作用：

<listbox model="@load(vm.items)" selectedItem="@bind(vm.selected)" hflex="true" height="300px">
    <listhead>
        <listheader label="Name" width="80px"/>
        <listheader label="Price" align="center" width="80px" />
        <listheader label="Quantity" align="center" width="80px" />
    </listhead>
    <template name="model" var="item">
        <listitem >
            <listcell>
                <label visible="@load(vm.selected ne item)" value="@load(item.name)" />
                <textbox visible="@load(vm.selected eq item)" value="@bind(item.name)" />
            </listcell>
            <listcell>
                <label visible="@load(vm.selected ne item)" value="@load(item.price)" />
                <intbox visible="@load(vm.selected eq item)" readonly="true" value="@bind(item.price)" />
            </listcell>
            <listcell>
                <label visible="@load(vm.selected ne item)" value="@load(item.quantity)" />
                <intbox visible="@load(vm.selected eq item)" readonly="true" value="@bind(item.quantity)" />
            </listcell>
        </listitem>
    </template>
</listbox>

一点解释，如果您使用以前的 ZK 8，您可以使用它。
因此，我们检查 zul 所选项是否等于 ( eq) 或不等于 ( ne) 呈现的项目。
然后我们更改该组件的可见性。
如果工作 ZK8 或更高版本，您可以使用<if test="load(vm.selected eq item)">.
有了这个，它可以处理阴影元素，并且不真实的条件将不会被渲染（不在 DOM 中），而使用可见它将在 DOM 中。

早期 ZK8 中的if 属性只能与${}表达式结合使用，MVVM 语法不起作用。
而且因为它只是静态的，你不能用它来实时切换。
所以这就是我们需要使用visible属性的原因。

Answer 2

这是一个迟到的回应，但仍然值得记录。

在 ZK 的 ADempiere 实现中，WListbox 使用 WListBoxRenderer 来呈现行和行中的所有单元格。定义每一列的类并将其应用于所有行，使行相同。WListBoxRenderer 使用此类来确定使用哪个组件来显示该字段以及使用哪个组件来编辑该字段。仅当初始化表时将列定义为读/写时，才启用编辑器。您可以使用 ColumnInfo 结构或通过如下所示的 setColumnClass() 和 setColumnReadWrite() 方法来执行此操作。

/**
 * Set the attributes of the column.
 *
 * @param index     The index of the column to be modified
 * @param classType The class of data that the column will contain
 * @param readOnly  Whether the data in the column is read only
 * @param header    The header text for the column
 *
 * @see #setColumnClass(int, Class, boolean)
 */
public void setColumnClass (int index, Class classType, boolean readOnly, String header)
{
    WListItemRenderer renderer = (WListItemRenderer)getItemRenderer();

    setColumnReadOnly(index, readOnly);

    renderer.setColumnHeader(index, header);

    renderer.setColumnClass(index, classType);

    if (index < m_modelHeaderClass.size())
        m_modelHeaderClass.set(index, classType);
    else
        m_modelHeaderClass.add(classType);

    return;
}

/**
 *  Set Column at the specified <code>index</code> to read-only or read/write.
 *
 *  @param index    index of column to set as read-only (or not)
 *  @param readOnly Read only value. If <code>true</code> column is read only,
 *                  if <code>false</code> column is read-write
 */
public void setColumnReadOnly (int index, boolean readOnly)
{
    Integer indexObject = new Integer(index);

    //  Column is ReadWrite
    if (m_readWriteColumn.contains(indexObject))
    {
        //  Remove from list
        if (readOnly)
        {
            m_readWriteColumn.remove(indexObject);
        }   //  ReadOnly
    }
    //  current column is R/O - ReadWrite - add to list
    else if (!readOnly)
    {
        m_readWriteColumn.add(indexObject);
    }

    return;
}   //  setColumnReadOnly

这是一个用于在“付款分配”表单中显示发票的示例。IMiniTable 接口由 WListBox 类实现。请注意，其中三列设置为 readOnly=false，因此这些单元格在表格中是可编辑的。

public void setInvoiceColumnClass(IMiniTable invoiceTable, boolean isMultiCurrency)
{
    Vector<String> names = getInvoiceColumnNames(isMultiCurrency);
    int i = 0;
    invoiceTable.setKeyColumnIndex(i);
    invoiceTable.setColumnClass(i, IDColumn.class, true, names.get(i++));        //  0-C_Invoice_ID
    invoiceTable.setColumnClass(i, Timestamp.class, true, names.get(i++));        //  1-TrxDate
    invoiceTable.setColumnClass(i, String.class, true, names.get(i++));           //  2-Value
    if (isMultiCurrency)
    {
        invoiceTable.setColumnClass(i, String.class, true, names.get(i++));       //  3-Currency
        invoiceTable.setColumnClass(i, BigDecimal.class, true, names.get(i++));   //  4-Amt
    }
    invoiceTable.setColumnClass(i, BigDecimal.class, true, names.get(i++));       //  5-ConvAmt
    invoiceTable.setColumnClass(i, BigDecimal.class, true, names.get(i++));       //  6-ConvAmt Open
    invoiceTable.setColumnClass(i, BigDecimal.class, false, names.get(i++));      //  7-Conv Discount
    invoiceTable.setColumnClass(i, BigDecimal.class, false, names.get(i++));      //  8-Conv WriteOff
    invoiceTable.setColumnClass(i, BigDecimal.class, false, names.get(i++));      //  9-Conv Applied
    invoiceTable.setColumnClass(i, BigDecimal.class, true, names.get(i++));     //  10-Conv OverUnder
    //  Table UI
    invoiceTable.autoSize();
}