I have a RadComboBox that gets populated on page_load() and is set w/ AutoPostback = "false" & EnableLoadOnDemand="false". When the user starts typing in the text area of the control, I don't want to find a match in the list until at least 3 characters have been entered. How can I accomplish this on the client side? Right now it finds a match for each character typed.
Thanks,
Rob
Thanks,
Rob
5 Answers, 1 is accepted
0
Thad
Top achievements
Rank 2
answered on 10 Aug 2011, 11:56 PM
Hi Dudeman,
Check out this article in the documentation, which gives a solution to your problem.
http://www.telerik.com/help/aspnet-ajax/combobox-request-items-given-number-letters.html
Thad
Check out this article in the documentation, which gives a solution to your problem.
http://www.telerik.com/help/aspnet-ajax/combobox-request-items-given-number-letters.html
Thad
0
Rob
Top achievements
Rank 1
answered on 11 Aug 2011, 02:40 PM
Thanks for your suggestion, Thad, but the provided link is not my situation at all. Like I previously stated, this combobox is prepopuatedon pageload and will not be repopulated on demand. The OnClientItemsRequesting event does not get fired off in my situation. I am looking for a JS event to evaluate the first 3 characters typed. I notice in OnClientKeyPressing that s.get_text() equals the entire text of the matching item in the text area.
Maybe I have to determine the difference of unhighlighted characters from the length of the item's text, because I notice that as I type the first 3 characters, they become unhighlighted one by one?
Maybe I have to determine the difference of unhighlighted characters from the length of the item's text, because I notice that as I type the first 3 characters, they become unhighlighted one by one?
0
Thad
Top achievements
Rank 2
answered on 11 Aug 2011, 04:49 PM
Hi Dudeman,
Sorry about that. Try this instead, which works for me.
Here is the markup I tested it with, in case your settings are different.
Hope that helps better than my first response!
Thad
Sorry about that. Try this instead, which works for me.
function
rcbFind_ClientKeyPressing(sender, eventArgs) {
sender.set_markFirstMatch(sender.get_inputDomElement().selectionStart >= 2);
}
Here is the markup I tested it with, in case your settings are different.
<
telerik:RadComboBox
ID
=
"rcbFind"
runat
=
"server"
MarkFirstMatch
=
"true"
AllowCustomText
=
"true"
OnClientKeyPressing
=
"rcbFind_ClientKeyPressing"
>
<
Items
>
<
telerik:RadComboBoxItem
runat
=
"server"
Text
=
"January"
Value
=
"1"
/>
<
telerik:RadComboBoxItem
runat
=
"server"
Text
=
"February"
Value
=
"2"
/>
<
telerik:RadComboBoxItem
runat
=
"server"
Text
=
"March"
Value
=
"3"
/>
<
telerik:RadComboBoxItem
runat
=
"server"
Text
=
"April"
Value
=
"4"
/>
<
telerik:RadComboBoxItem
runat
=
"server"
Text
=
"May"
Value
=
"5"
/>
<
telerik:RadComboBoxItem
runat
=
"server"
Text
=
"June"
Value
=
"6"
/>
<
telerik:RadComboBoxItem
runat
=
"server"
Text
=
"July"
Value
=
"7"
/>
<
telerik:RadComboBoxItem
runat
=
"server"
Text
=
"August"
Value
=
"8"
/>
<
telerik:RadComboBoxItem
runat
=
"server"
Text
=
"September"
Value
=
"9"
/>
<
telerik:RadComboBoxItem
runat
=
"server"
Text
=
"October"
Value
=
"10"
/>
<
telerik:RadComboBoxItem
runat
=
"server"
Text
=
"November"
Value
=
"11"
/>
<
telerik:RadComboBoxItem
runat
=
"server"
Text
=
"December"
Value
=
"12"
/>
</
Items
>
</
telerik:RadComboBox
>
Hope that helps better than my first response!
Thad
0
Thad
Top achievements
Rank 2
answered on 11 Aug 2011, 05:07 PM
Whoops - that JavaScript works in Firefox/Chrome only. Here is the cross browser version. I tested in IE8, Firefox 3.6, and Chrome 12.
Thad
function
rcbFind_ClientKeyPressing(sender, eventArgs) {
if
(document.selection != undefined) {
// IE
var
len = sender.get_text().length - document.selection.createRange().text.length;
sender.set_markFirstMatch(len >= 2);
}
else
if
(sender.get_inputDomElement().selectionStart != undefined) {
// Firefox, Chrome
sender.set_markFirstMatch(sender.get_inputDomElement().selectionStart >= 2);
}
}
Thad
0
Rob
Top achievements
Rank 1
answered on 11 Aug 2011, 07:11 PM
The IE code is what I was looking for and it works like a charm. Thank you so much, Thad!