Handle Multi-Input Screen Element in SAP UI5
Requirement – Add “Multi Input” screen element and capture the added or deleted entries.
XML Code
<Label text="Agreement Description">
</Label>
<MultiInput id="agrMultiInputDes" showValueHelp="false">
</MultiInput>
</VBox>
Controller Code
onInit: function () {
var agrMultiInput = this.getView().byId("agrMultiInputDes");
var fnValidator = function (args) {
var text = args.text;
return new Token({
key: text,
text: text
});
};
agrMultiInput.addValidator(fnValidator);
agrMultiInput.attachTokenUpdate(function (oEvent) {
that.handleTokenDelete(oEvent);
});
}
handleTokenDelete: function (oEvent) {
var sType = oEvent.getParameter("type"),
aAddedTokens = oEvent.getParameter("addedTokens"),
aRemovedTokens = oEvent.getParameter("removedTokens");
var aSearchData = [];
switch (sType) {
case "added":
aAddedTokens.forEach(function (oToken) {
aSearchData.push({
token: oToken.getText()
});
break;
case "removed":
aRemovedTokens.forEach(function (oToken) {
aSearchData = aSearchData.filter(function (oContext) {
return oContext.token !== oToken.getText() });
});
break;
default:
break;
}
}
