/scripts/ahub.form.attachments.js
0

MultiInput control render token incorectly when choosing duplicate items

Apr 26, 2017 at 01:14 AM

101

avatar image

Hi,

I have created the following example to demo the problem I have encountered.

var input = new sap.m.MultiInput({ placeholder: "Customer", showSuggestion: true }).placeAt('content'); input.addSuggestionItem(new sap.ui.core.Item({ key: '1', text: 'April' })); input.addSuggestionItem(new sap.ui.core.Item({ key: '2', text: 'Apri' })); input.addSuggestionItem(new sap.ui.core.Item({ key: '3', text: 'Apr' })); input.addSuggestionItem(new sap.ui.core.Item({ key: '4', text: 'Ap' }));

When I choose April from the suggestion in the input, the first time it will add an 'April' token to the input, however, when I choose April for the second time, it will just show a plain text 'April' and I cannot delete it unless I use backspace key.

Could you please tell me why?

The following example using model binding doesn't seem to have the same problem. I was able to add 'April' twice and it will generate two 'April' tokens.

http://jsbin.com/qobuma/edit?html,js,output

Also, is there any configuration to remove any items that has been selected from the suggestion items automatically?

Thank you very much for your help.

Vivien

10 |10000 characters needed characters left characters exceeded
* Please Login or Register to Answer, Follow or Comment.

1 Answer

Best Answer
Veeraraghavan Narasimhan
Apr 26, 2017 at 02:19 AM
0

Hello Vivien,

I debugged the code of MultiInput and it appears that this behaviour is due to the tokenizer implementation. This is the code in tokenizer

if (!oToken) {
			return false;
		}


		var tokenExists = this._tokenExists(oToken);
		if (tokenExists) {
			return false;
		}


		this.addToken(oToken);

You see in the code if the token already exists then the code exits the addition of the token. However i would suggest that you can have your own event handler for the event "suggestionItemSelected" on the control and write your code to have it updated in the input control. This also answers why when binding this issue does not occur because the Token update event is not all invoked in that scenario. Let me know if the above suggestion works.

Thanks and Regards,

Veera

Show 1 Share
10 |10000 characters needed characters left characters exceeded

HI Veera,

Thank you very much for your answer. I will give it a try.

Also, is it possible we can somehow configure the MultiInput control to not show the suggestionItem if it is already selected?

That is actually what we need. We are trying to add users to the input from the suggestions and if the user is already selected, we would like to exclued the user from the suggestion.

Thanks,

Vivien

0
Skip to Content