This is a migrated thread and some comments may be shown as answers.

RadComboBox Enter Key Postback SelectedIndex

1 Answer 148 Views
ComboBox
This is a migrated thread and some comments may be shown as answers.
Mike Lichter
Top achievements
Rank 1
Mike Lichter asked on 05 Nov 2010, 06:56 PM
Here is what I am trying to do.  I want a searchable combobox.  Enter key does nothing unless the text typed into the search match's something in the list, or something is already selected (highlighted) via the down/up arrows.

I feel I'm almost there.  I had to check eventArgs._domEvent to get the keyCode.  eventArgs.keyCode is undefined.
The line: item.select() does not seem to work. var item = sender.findItemByText(sender.get_text()); however is finding the correct item.


Any help here would be great.  I don't think what I am trying to do is a crazy scenario.  I think this is a common auto complete.

<script type="text/javascript">
    var ent = false
       
    function DetectEnter(sender, eventArgs) 
    
        var keyCode = eventArgs._domEvent.keyCode; 
           
        if (keyCode == 13) 
        {
            ent = true;
            var item = sender.findItemByText(sender.get_text());
            if (item) {
                item.select();
                ent = false;
            }
        
        else 
        
           ent = false
        
    
 
    function CheckEnter(sender, eventArgs) 
    {
        var combo = $find("<%= _SymbolLookup.ClientID %>"); 
         
        combo.hideDropDown(); 
        var temp = ent;
        ent = false;
        eventArgs.set_cancel(temp); 
    
</script>

<telerik:RadComboBox ID="_SymbolLookup" runat="server" AllowCustomText="true" Filter="StartsWith"
    DataTextField="ContactName" EnableLoadOnDemand="True" ShowMoreResultsBox="True"
    EmptyMessage="Type to search for symbol..." OnSelectedIndexChanged="_SymbolLookup_SelectedIndexChanged"
    OnItemsRequested="SymbolLookup_OnItemsRequested" DropDownWidth="525px" Width="200px"
    HighlightTemplatedItems="true" AutoPostBack="true" OnClientKeyPressing="DetectEnter"
    OnClientSelectedIndexChanging="CheckEnter">
    <HeaderTemplate>
        <table width="500px" cellspacing="0" cellpadding="0">
            <tr>
                <td style="width: 50px;">
                    Symbol
                </td>
                <td style="width: 375px;">
                    Name
                </td>
                <td style="width: 75px;">
                    Status
                </td>
            </tr>
        </table>
    </HeaderTemplate>
    <ItemTemplate>
        <table width="500px" cellspacing="0" cellpadding="0">
            <tr>
                <td style="width: 50px;">
                    <%# DataBinder.Eval(Container, "Attributes['Symbol']")%>
                </td>
                <td style="width: 375px; overflow: hidden;">
                    <%# DataBinder.Eval(Container, "Attributes['Instrument_Name']")%>
                </td>
                <td style="width: 75px;">
                    <%# DataBinder.Eval(Container, "Attributes['Status']") %>
                </td>
            </tr>
        </table>
    </ItemTemplate>
</telerik:RadComboBox>

1 Answer, 1 is accepted

Sort by
0
Simon
Telerik team
answered on 09 Nov 2010, 10:46 AM
Hi Mike Lichter,

You can get the key code in all browser with the following code:
var e = eventArgs.get_domEvent();
var keyCode = e.keyCode || e.which;

On the other hand, I am not sure the select() method does not work as it is used internally on many occasions in all selection use-cases. Can you explain in greater detail this issue? 

Kind regards,
Simon
the Telerik team
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
Tags
ComboBox
Asked by
Mike Lichter
Top achievements
Rank 1
Answers by
Simon
Telerik team
Share this question
or