Setting radcombobox when show item

6 posts, 0 answers
  1. Fabio Cirillo
    Fabio Cirillo avatar
    181 posts
    Member since:
    Jan 2010

    Posted 23 Jan 2013 Link to this post

    Hi,
    if I write a search word in the combo, I can give the possibility that the item chosen is selected and confirmed with the tab on the keyboard? Because now I can only really select it with a click. Example I load in a combo record with its id. If I select the record in the combo only with the tab when I go to save the database I see that the id of the record in the combo is selected. however, if I click on the record of the combo everything works. I would like to speed up the management of the data that the user can select the record in the combo even just by pressing the Tad keyboard.

    Then I load the data in this combo with the webservice. Is there a way that when you scroll the data to display multiple records you see the message waiting?

    Then you can that when I select a record and I want to reopen the combo to select a new record, you will see the list of records from the selected one? Currently I have to delete the selected record to resume viewing records.

    the code of radcombo is:

    <telerik:RadComboBox ID="Comune" Runat="server" DropDownWidth="270px"
        EmptyMessage="Seleziona la tua città" EnableLoadOnDemand="True"
        Filter="StartsWith" Height="175px" MaxHeight="175px" EnableVirtualScrolling="True"
        LoadingMessage="Caricamento..." ShowMoreResultsBox="True"
        Skin="Sunset" Width="287px">
        <WebServiceSettings Method="GetCityNames" Path="WebService.asmx" />
    </telerik:RadComboBox>
  2. Hristo Valyavicharski
    Admin
    Hristo Valyavicharski avatar
    975 posts

    Posted 25 Jan 2013 Link to this post

    Hi Fabio,

    You can handle the KeyPressing event and modify the functionality according to the pressed button:
    function RadComboBox1_KeyPressing(sender, args) {
        //If ENTER was pressed
        if (args.get_domEvent().keyCode == 13) {
            //do something
        }
     
        //If TAB was pressed
        if (args.get_domEvent().keyCode == 9) {
            //do something
        }
    }

    To show a waiting message just set the LoadingMessage property:
    <telerik:RadComboBox ID="RadComboBox1" runat="server"
              DataSourceID="SqlDataSource1"
              DataTextField="ProductName"
              DataValueField="ProductID"
              EnableLoadOnDemand="true"
              ItemsPerRequest="10"
              EnableVirtualScrolling="true"
              MinFilterLength="3"
              Filter="Contains"
              EmptyMessage="Type at least 3 digits"
              LoadingMessage="Loading...."
              OnClientKeyPressing="RadComboBox1_KeyPressing"/>

    I hope this helps.

    Regards, Hristo Valyavicharski
    the Telerik team
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
  3. Fabio Cirillo
    Fabio Cirillo avatar
    181 posts
    Member since:
    Jan 2010

    Posted 01 Feb 2013 Link to this post

    Hi,
    ok, when i'm writing into radcombobox, if i see the word that i must select, i must to press the enter or the tab on radcombo and utomatically, the owrd must to be select and the focus must to go next radtextbox.

    For example...to see the image....

    as I write I find the word, even to select the id of the bend what he says I have to click with the mouse combo. I wish by pressing the enter or tab, I could select the word with the DataValue
  4. Hristo Valyavicharski
    Admin
    Hristo Valyavicharski avatar
    975 posts

    Posted 06 Feb 2013 Link to this post

    Hi Fabio,

    In order to navigate through all controls with TAB key you will have to set TabIndex property for every control on the page. Then modify the javascript as follows:
    function KeyPressing(sender, args) {
        //If ENTER was pressed
        if (args.get_domEvent().keyCode == 13) {
     
        }
     
        //If TAB was pressed
       if (args.get_domEvent().keyCode == 9) {
            if (sender.get_highlightedItem()) {
                sender.get_highlightedItem().select();
            }
        }
    }
     
    function OnclientFocus(sender, args) {
          var input = sender.get_inputDomElement();
          sender.highlightAllMatches(input.defaultValue);
          sender.showDropDown();
    }

    I'm attaching sample showing how to use this javascript. Also you could take a look at the online demo for ComboBox with Keyboard navigation. 

    Regards,
    Hristo Valyavicharski
    the Telerik team
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
  5. Fabio Cirillo
    Fabio Cirillo avatar
    181 posts
    Member since:
    Jan 2010

    Posted 06 Feb 2013 Link to this post

    I followed your instructions but if you see in the picture I posted you can see that if I write the word "Ana" and it appears in the word "Analyst", is a word found, I would like that pressing the enter button or tab was automatically selects the word "analyst" with its value. But now when I press the tab or enter I pass to the next field but the combo is only the word "Ana" and then I also have an error at the level of the value of the record.

    This is my code:

    <telerik:RadComboBox ID="Categoria" Runat="server" DropDownWidth="350px" Height="175px"
        EmptyMessage="Seleziona la tua categoria" EnableLoadOnDemand="True"
        EnableVirtualScrolling="True" LoadingMessage="Caricamento..."
        ShowMoreResultsBox="True" Filter="StartsWith" 
        MaxHeight="175px" Skin="Sunset" Width="350px" EnableItemCaching="True"
        Font-Italic="True" Font-Names="Verdana" OnClientFocus="OnclientFocus"
         OnClientKeyPressing="KeyPressing" TabIndex="1">
        <WebServiceSettings Path="WebService.asmx" Method="GetCategoryNames" />
    </telerik:RadComboBox>
  6. Hristo Valyavicharski
    Admin
    Hristo Valyavicharski avatar
    975 posts

    Posted 11 Feb 2013 Link to this post

    Hi Fabio,

    I looked into your RadComboBox definition and noticed that you don't set MarkFirstMatch. Please try to add it:

    <telerik:RadComboBox ID="Categoria" Runat="server" DropDownWidth="350px" Height="175px"
        EmptyMessage="Seleziona la tua categoria" EnableLoadOnDemand="True"
        EnableVirtualScrolling="True" LoadingMessage="Caricamento..."
        ShowMoreResultsBox="True" Filter="StartsWith"
        MaxHeight="175px" Skin="Sunset" Width="350px" EnableItemCaching="True"
        Font-Italic="True" Font-Names="Verdana" OnClientFocus="OnclientFocus"
         OnClientKeyPressing="KeyPressing" TabIndex="1" MarkFirstMatch="true">
        <WebServiceSettings Path="WebService.asmx" Method="GetCategoryNames" />
    </telerik:RadComboBox>

    Then use the same JavaScript from the previous post.

    Kind regards,
    Hristo Valyavicharski
    the Telerik team
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
Back to Top