Generic Livechange Event for SAPUI5 Input control
Use cases of this blog/codebase –
* Validate and Update each character as and when the end-user types each character/digit
* The need for a generic framework/APIs
* Re-usable and Scalable codebase
Category: SAPUI5 Development
Code: XML and JavaScript
Files: *.view.xml and *.controller.js or any other utility.js
UI5 Controls:
* sap.m.Input
Events:
* Change, liveChange
Advantages:
* Generic API to Validate and Update Input field as and when the end-user types each character
* Re-usable and Scalable API
Generic LiveChange Event for SAPUI5 Input control – In View.xml Code
Generic LiveChange Event for SAPUI5 Input control – In Controller.js Code
onLiveChangeInputValidate: function(oEvent){ var inputValue = oEvent.getParameter(‘value’).trim(); var newValue = inputValue; //determine the value range that should be allowed var sCondition = oEvent.getSource().data()[“liveChangeAllow”]; sCondition = sCondition? sCondition: “”; switch (sCondition){ case ‘digits’: newValue = newValue.replace(/[^d]/g, “); break; case ‘characters’: // /^[A-Za-z]+$/; newValue = newValue.replace(/[d]/g, ”); break; case ‘uppercase’: newValue = newValue.toUpperCase().replace(/[d]/g, “); break; case ‘lowercase’: newValue = newValue.toLowerCase().replace(/[d]/g, ”); break; case ‘signfloat’: var firstchar = newValue[0]; newValue = newValue.replace(/[^d.]/g, “); if(firstChar == ’-’ || firstChar == ’+’){ newValue = firstChar + newValue; } break; case ‘CUSTOM_RULE’: break; default: break; } //determine max length to be allowed var maxLength = oEvent.getSource().data()["liveChangeMaxLength”]; if(maxLength){ newValue = newValue.substring(0,maxLength); } //warn on invalid input var msgOnInvalidInput = oEvent.getSource().data()[“liveChangeMsgOnInvalidInput”]; if(msgOnInvalidInput && (newValue != inputValue)){ for(var i=0;i http://bit.ly/2Aryjuj #SAP #SAPCloud #AI
