验证输入框在 table 行中被禁用 - SAP UI5

Question

我有一个 table，其中有一列有 3 个按钮和一个输入框。更新、保存、输入框和取消。当我们第一次进入页面时，table 加载所有行的输入框为禁用。只有一个按钮 - 更新在那个时候是可见的（在每一行）。单击“更新”后，输入框将启用（针对该行），“更新”将被隐藏，保存和取消按钮将变为可见。如果按下保存或取消，两个按钮都会隐藏，输入框再次被禁用，更新可见。这是为了确保用户在输入框中输入值并正确保存。

问题：如果我点击更新，并输入一些随机值。此时如果我保存好，但如果我不保存并且在 table 下是一个按钮 post 数据到后端，如果我单击它，我输入的值将传递到后端。我想确保每一行都经过验证以查看用户是否具有 saved/cancel 并且输入框被禁用（意味着输入的值是正确的和最终的）。我应该如何循环？

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 在模型中存储了输入状态。您可以使用它和 Array.filter 循环遍历 table 行的上下文：

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
    }
}

验证输入框在 table 行中被禁用 - SAP UI5

Validate input box is disabled in table rows - SAP UI5

sapui5