AjaxControlToolkit’s AutoComplete extender is designed to be a single selection control. i.e. When user selects a value the dropdown list will be closed and selected text will be assigned to targeted textbox control.
Recently I got a question on the Asp.net Forums where the user wants to make the AutoCompleteExtender a multi select one. Besides the chosen values should be appended to textbox as comma separated values. This question caught my attention as it was a little tricky.
Here are the details of requirements
- Keep the dropdown list of options on AutoComplete Extender opened
- Allow multiple selection on AutoComplete Extender
- Add the string to target textbox control as comma separated strings
We need to come up with a custom implementation to accomplish this requirement. When I looked at some threads I found the code to keep the list opened. However, I need to customize it to generate comma separated values.
You can find complete implementation details here
Add a behaviorID to AutocompleteExtender control. We will use this id to close the dropdown list after user selecting values
Now we need to add a button to close the dropdown list after selecting values
Now we need to customize the inbuilt function “_setText” and “_hideCompletionList” function in order to accomplish our requirement
Code to populate the list when user type in characters on textbox