Question

我有一个表，该表的列包含3个按钮和一个输入框。更新，保存，输入框和取消。当我们第一次进入页面时，表中的所有行都被输入框禁用。那时（每行）只有一个按钮-更新可见。单击更新后，输入框将启用（对于该行），更新将被隐藏，保存和取消按钮将变为可见。如果按下保存或取消中的任意一个，则两个按钮均被隐藏，再次禁用输入框并显示更新。这是为了确保用户在输入框中输入值并正确保存。

问题：如果我单击更新，然后输入一些随机值。在这一点上，如果我保存好，但是如果我不保存，则表下方是将数据发布到后端的按钮，如果单击该按钮，则输入的值将传递到后端。我想确保每一行都经过验证，以查看用户是否已保存/取消并且输入框已禁用（这意味着输入的值正确且是最终值）。我该如何循环浏览？

View.xml

<table:Column>
    <Label text="ABC"/>
    <table:template>
        <HBox alignItems="Center">
            <Button text="Update" visible="{path:'model>', formatter:'.updateBtnVisibility'}" press="openQtyInputBox"/>
            <Button text="Save" visible="{= !${model>qtyEditable}}" press="qtySave"/>
            <Input visible="{path:'model>', formatter:'.inputValidation'}" type="Number" enabled="{!${model>qtyEditable}}" value="{path: 'model>QtyToReceive', type: 'sap.ui.model.type.Integer', constraints : {minimum: 0}}"/>
            <core:Icon src="sap-icon://reset" tooltip="Cancel" press="cancelQtyInput" visible="{= !${model>qtyEditable}}"/>
        </HBox>
    </table:template>
</table:Column>

Answer 1

似乎您已经使用qtyEditable将输入状态存储在模型中。您可以使用此键和demo遍历表行的上下文：

validateRows: function() {
    var rowContexts = this.getView().byId("your-table-id").getBinding("rows").getContexts();

    if (rowContexts.filter(function (context) {
        return context.getProperty("qtyEditable");
    }).length === 0) {
        // all rows are saved
    } else {
        // at least one row is still in edit mode
    }
}

验证表行中的输入框已禁用-SAP UI5

1 个答案: