AutoCompleteBox to remain with open dropdown to allow multiselection
HOW TO
Configure the AutoCompleteBox imitate the behavior of the Kendo UI MultiSelect widget by allowing the selection of multiple items without closing the dropdown on item click.
SOLUTION
Remove the default click handler of the items container of the AutoCompleteBox' dropdown:
<script type="text/javascript">
function OnClientLoad(sender, args) {
// http://api.jquery.com/off/
$telerik.$(sender._dropDown.get_itemsContainer()).off("click").on("click", function (e) {
sender._dropDown._onDropDownClick(e);
// reposition the Dropdown if the input is resized
setTimeout(function () {
sender._dropDown._dropDown.reflow();
}, 50);
//the default code that closed the Dropdown when an item is clicked
//that.close();
})
}
</script>
<telerik:RadAutoCompleteBox runat="server" OnClientLoad="OnClientLoad"
InputType="Token" Width="300px" DropDownHeight="150" ID="RadAutoCompleteBox1">
</telerik:RadAutoCompleteBox>
protected void Page_Init(object sender, EventArgs e)
{
RadAutoCompleteBox1.DataSource = new string[] { "Item 1", "Item 2", "Item 3" };
RadAutoCompleteBox1.DataBind();
}
Protected Sub Page_Init(ByVal sender As Object, ByVal e As EventArgs)
RadAutoCompleteBox1.DataSource = New String() {"Item 1", "Item 2", "Item 3"}
RadAutoCompleteBox1.DataBind()
End Sub