SAPUI5绑定OData服务模型时货币输入验证异常问题
SAPUI5货币Input保存时值未格式化的解决方案
问题核心:SAPUI5的Input控件默认仅在失去焦点时,才会将用户输入的内容经过类型解析、验证后同步到绑定的模型中。如果输入值后直接点击保存按钮(未让Input失去焦点),模型中仍保留原始输入的未格式化值(比如JPY的2.5),导致错误提交到后端。
以下是几种更优雅的解决方案:
方案1:保存前主动触发控件值提交
在保存按钮的点击事件中,先调用Input的submitValue()方法,强制控件将当前输入值解析、验证后同步到模型,再执行submitChanges()。
代码示例:
首先给Input添加id:
<Input id="netPriceInput" value="{ parts: ['rfqsService>netPrice', 'rfqsService>currency'], type: 'sap.ui.model.type.Currency', formatOptions: {showMeasure: false} }" description="{rfqsService>currency}" />
然后在控制器的保存方法中处理:
onSavePress: function() { const oPriceInput = this.getView().byId("netPriceInput"); if (oPriceInput) { oPriceInput.submitValue(); // 强制同步值到模型,触发货币类型的解析和 rounding } this.getView().getModel("rfqsService").submitChanges(); }
这个方法的优势是:仅在保存时触发一次值同步,不会影响用户输入过程中的体验,也不会产生额外的性能开销。
方案2:开启绑定的实时同步
在Input的value绑定配置中添加liveUpdate: true,让用户输入的内容实时同步到模型,同时触发类型解析和验证。
代码示例:
<Input value="{ parts: ['rfqsService>netPrice', 'rfqsService>currency'], type: 'sap.ui.model.type.Currency', formatOptions: {showMeasure: false}, liveUpdate: true }" description="{rfqsService>currency}" />
注意:开启liveUpdate后,用户每输入一个字符都会触发模型更新和类型解析,可能会出现即时格式化的效果(比如输入到2.时就被处理),需要根据实际用户体验需求权衡是否使用。
为什么临时方案(change事件)不够优雅?
change事件仅在Input失去焦点时触发,如果用户输入值后直接点击保存按钮,Input未失去焦点,change事件不会触发,模型值仍未更新——你当前的临时方案可能是手动在change事件里更新模型,但本质上还是依赖焦点变化,无法覆盖直接点击保存的场景。
内容的提问来源于stack exchange,提问作者Adam Harkus
相关产品推荐
相关产品推荐

