Need to display the value of the item in the input text when user selects an item in the list

[Hemangajit]

Hi,
        I am evaluating the Telerik Rad Combobox. I have business requirement that when I select an item in the list I need to display the corresonding value in the testbox. For example I have declared a combobox as as follows:

<

telerik:RadComboBox ID="RadComboBox1" runat="server">

    <Items>

        <telerik:RadComboBoxItem Value="E" Text="Engineering" />

        <telerik:RadComboBoxItem Value="P" Text="Physics" />

    </Items>

</telerik:RadComboBox>

Now when I select Physics in the list it should display P in the textbox. Please let me know if this is possible with RadComboBox.

Thanks
Hemangajit

[Rosi]

Hi Hemangajit,

You can do this by hooking on OnClientSelectedIndexChanged event and executing the following jaavscript:

<script type="text/javascript">

function OnClientSelectedIndexChanged(sender,e)
{
   sender.set_text(e.get_item().get_value());
}

</script>

Greetings,
Rosi
the Telerik team

Instantly find answers to your questions at the new Telerik Support Center

[Hemangajit]

Hi Rosi,
                Thanks a lot. It worked wonderful. I want to know if this behaviour can be replicated for the "MarkFirstMatch" property. I want to prefill the textbox with the "value" of the first matching item when user types in the text of the item. Say the combobox is as follows:

<telerik:RadComboBox ID="RadComboBox1" runat="server">

    <Items>

        <telerik:RadComboBoxItem Value="EN" Text="Engineering" />

        <telerik:RadComboBoxItem Value="PH" Text="Physics" /> 

        <telerik:RadComboBoxItem Value="MA" Text="Maths" /> 
        

    </Items>

</telerik:RadComboBox>

When user types in "M", "MA" should be populated in the textbox. Please let me know whether its possible.

Thanks
Hemangajit

[Rosi]

Hi Hemangajit,

This task cannot be achieved so easy as the previous one.

I suggest you use Templates in order to switch text and value.

For example

<telerik:RadComboBox ID="RadComboBox1" runat="server">
<ItemTemplate>
<%# DataBinder.Eval(Container, "Value")%>
</ItemTemplate>
    <Items>
        <telerik:RadComboBoxItem Text="EN" Value="Engineering" />
        <telerik:RadComboBoxItem Text="PH" Value="Physics" />
    </Items>
</telerik:RadComboBox>

Note that if you use this approach you will need to call the DataBind method of RadComboBox.

I suggest you try it and let us known how this goes.

Regards,
Rosi
the Telerik team

Instantly find answers to your questions at the new Telerik Support Center

[Hemangajit]

Hi Rosi,
             Thanks a lot. But with this approach, the value of the items are displayed on the list. I need to display the text of the items on the list. When user types in a letter in the input text, the value of the corresponding matching text should be populated in the textbox. I am just quoting the example given by me previously -

<telerik:RadComboBox ID="RadComboBox1" runat="server">

    <Items>

        <telerik:RadComboBoxItem Value="EN" Text="Engineering" />

        <telerik:RadComboBoxItem Value="PH" Text="Physics" /> 

        <telerik:RadComboBoxItem Value="MA" Text="Maths" /> 
        

    </Items>

</telerik:RadComboBox>

 The combobox will display "Engineering", "Physics" and "Maths" in the list, but when user types "P" in the input text, "PH" should be populated in the input text as "Physics" is the matching item and "Physics" should be highlighted in the list. Please let me know if you need more information.

Thanks
---------------
Hemangajit

[Rosi]

Hello Hemangajit,

Please find the attached project illustrating how you can achieve the approach.

Regards,
Rosi
the Telerik team

Instantly find answers to your questions at the new Telerik Support Center

[Hemangajit]

Hi Rosi,
                  Thanks so much. Your example really helped me to solve the problem.

Thanks
Hemangajit

[Hemangajit]

Hi,
        Greetings. This is a question based on the following thread. I am creating the RadComboBoxes at runtime in the page. How can I assign the same ItemTemplate at the runtime for the dynamically created RadCombobox?

Thanks
Hemangajit

[Rosi]

Hello Hemangajit,

Please read our help article - Adding Templates and scroll the page to "Adding templates at runtime" section.

Regards,
Rosi
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.

[Hemangajit]

Hi Rosi,
               Thanks. I have implemented it in the following way. But it is not working. I think in the TemplateProcessor class I am missing something. Can you please help me out.

public class TemplateProcessor : ITemplate
    {
        public void InstantiateIn(Control container)
        {
            RadComboBoxItem item = (RadComboBoxItem)container;
            RadComboBox combo = item.ComboBoxParent;
            combo.Text = (string)DataBinder.Eval(item, "Value");
        }
    }

        RadComboBox ddlControl = new RadComboBox();
            ddlControl.ItemTemplate = new TemplateProcessor();
            ddlControl.ID = "Testddl";
          for (int i = 0; i < sObject.SpecificationValueList.Count; i++)
            {
                string strText = sObject.SpecificationTextList[i].ToString();
                string strValue = sObject.SpecificationValueList[i].ToString();
                ddlControl.Items.Add(new RadComboBoxItem(strValue, strText));
            }
            TemplateProcessor template = new TemplateProcessor();
            foreach (RadComboBoxItem item in ddlControl.Items)
            {
                template.InstantiateIn(item);
            }

            ddlControl.DataBind();

            ddlControl.EnableViewState = false;
            ddlControl.HighlightTemplatedItems = true;
            ddlControl.AllowCustomText = true;
            ddlControl.MarkFirstMatch = true;
            ddlControl.CollapseAnimation.Duration = 200;
            ddlControl.ExpandAnimation.Duration = 200;

[Rosi]

Hello Hemangajit,

Please find the attached project. It works as expected.

Regards,
Rosi
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.

[Hemangajit]

Hi Rosi,
               Thanks for your solution. However I am facing a little problem here. Ideally the drop down should show 0,1,2,3,...9 and when you select 1, the textbox should populated with 2. But here, the dropdown shows the values only i.e. 2, 4,6, 8...etc. Please help.

Thanks
Hemangajit

[Rosi]

Hello Hemangajit,

I am sorry for the misunderstanding.

Please find the modified project.

Regards,
Rosi
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.

[Hemangajit]

Hello Rosi,
                       Thanks a lot. It worked out superb.

Thanks
Hemangajit