Radtreeview inside radCombobo with filtering support.

10 posts, 0 answers
  1. sankardeep v
    sankardeep v avatar
    26 posts
    Member since:
    Jan 2010

    Posted 25 Mar 2010 Link to this post

    Hi,
                     I need some help guys . I need  a treeview to be inside a combobox that i know how to do .
    But what i need i also need to filter the comboBox. Atleast  i need to filter the Parent Elements.
    Help me guys .
    Sankar
  2. sankardeep v
    sankardeep v avatar
    26 posts
    Member since:
    Jan 2010

    Posted 26 Mar 2010 Link to this post

    its been almost 24 hrs not a single post . come guys please help.........
  3. Kalina
    Admin
    Kalina avatar
    918 posts

    Posted 26 Mar 2010 Link to this post

    Hello sankardeep v,

    I am afraid that filtering a RadTreeView nested within the ItemTemplate of a RadComboBox control is not supported. That is why I will suggest you something similar.

    You can handle OnclientKeyPressing event, search among the tree nodes to find the matching one:

    <telerik:RadComboBox ID="RadComboBox1" Width="300"
        AllowCustomText="true" DropDownWidth="300"
        Height="300"
        OnClientKeyPressing="OnClientKeyPressingHandler"
        runat="server">
        <ItemTemplate>
            <div onclick="StopPropagation(event)">
                <telerik:RadTreeView ID="RadTreeView1"
                OnClientNodeClicked="OnClientNodeClickedHandler"
                    runat="server">
                    <Nodes>
                        <telerik:RadTreeNode runat="server" Text="Mazda">
                            <Nodes>
                                <telerik:RadTreeNode runat="server" Text="Toyota">
                                    <Nodes>
                                        <telerik:RadTreeNode runat="server" Text="Honda">
                                        </telerik:RadTreeNode>
                                        <telerik:RadTreeNode runat="server" Text="BMW">
                                        </telerik:RadTreeNode>
                                    </Nodes>
                                </telerik:RadTreeNode>
                                <telerik:RadTreeNode runat="server" Text="Mercedes">
                                </telerik:RadTreeNode>
                            </Nodes>
                        </telerik:RadTreeNode>
                        <telerik:RadTreeNode runat="server" Text="Audi">
                            <Nodes>
                                <telerik:RadTreeNode runat="server" Text="Subaru">
                                </telerik:RadTreeNode>
                            </Nodes>
                        </telerik:RadTreeNode>
                        <telerik:RadTreeNode runat="server" Text="Mitsubishi">
                        </telerik:RadTreeNode>
                    </Nodes>
                </telerik:RadTreeView>
            </div>
        </ItemTemplate>
        <Items>
            <telerik:RadComboBoxItem runat="server" />
        </Items>
    </telerik:RadComboBox>

    <script type="text/javascript">
     
        function OnClientKeyPressingHandler(sender, eventArgs) {
             
            var e = eventArgs.get_domEvent();
            var code = e.which || e.charCode || e.keyCode;
            var character = String.fromCharCode(code);
            if (!e.shiftKey)
                character = character.toLowerCase();
            var searchText = sender.get_text() + character;
            var tree = sender.get_items().getItem(0).findControl("RadTreeView1");
            var nodes = tree.get_allNodes();
     
            for (var i = 0; i < nodes.length; i++) {
                if (nodes[i].get_text().startsWith(searchText)) {
                    var node = nodes[i];
                    var text = node.get_text();
                    node.select();
                    node.expand();
                    while (node.get_parent() != tree) {
                        node.get_parent().expand();
                        node = node.get_parent();
                    }
                    setTimeout(function() { sender.set_text(text); }, 0);
                    break;
                }
            }
        }
     
        function OnClientNodeClickedHandler(sender, eventArgs) {
            var node = eventArgs.get_node();
            var combo = $find("<%= RadComboBox1.ClientID %>");
            combo.set_text(node.get_text());
        }
     
        function StopPropagation(e) {
            e.cancelBubble = true;
            if (e.stopPropagation) {
                e.stopPropagation();
            }
        }
    </script>

    All the best,
    Kalina
    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.
  4. Karthik Kantharaj
    Karthik Kantharaj avatar
    101 posts
    Member since:
    Mar 2010

    Posted 15 Jun 2011 Link to this post

    Hi Kalina
    I am using the sample you gave

    I am facing one problem in the code
    I am not able to take the value of the node that i select

    In the code there is only text and no value for the tree nodes
     <ComboBox ID="RadComboBox1" Width="300"  AllowCustomText="true" DropDownWidth="300" Property="OUID"
                Height="300" OnClientKeyPressing="OnClientKeyPressingHandler" runat="server">
                <ItemTemplate>
                    <div onclick="StopPropagation(event)">
                        <telerik:RadTreeView ID="RadTreeView1" OnClientNodeClicked="OnClientNodeClickedHandler"
                            runat="server">
                        </telerik:RadTreeView>
                    </div>
                </ItemTemplate>
                <Items>
                    <telerik:RadComboBoxItem runat="server" />
                </Items>
            </ComboBox>

    CS
      protected void Page_Load(object sender, EventArgs e)
            {
                if (!Page.IsPostBack)
                {              
                  
                 
                    RadTreeView objTree = (RadTreeView)RadComboBox1.Items[0].FindControl("RadTreeView1");
                    if (null != objTree)
                        bindApplicationsTree(ref objTree);
                }          
              
            }
            private void bindApplicationsTree(ref RadTreeView objtree)
            {          
                objtree.DataTextField = "Name";
                objtree.DataFieldParentID = "ParentID";
                objtree.DataFieldID = "ID";
                objtree.DataSource = LoadData();
                objtree.DataBind();

            }

    I have button in aspx page and when i click on that i need selected node value i.e ID of the node

    Please help me

    Karthik.K
  5. Karthik Kantharaj
    Karthik Kantharaj avatar
    101 posts
    Member since:
    Mar 2010

    Posted 15 Jun 2011 Link to this post

    Hi

    I found the solution

    Thanks
  6. Karthik Kantharaj
    Karthik Kantharaj avatar
    101 posts
    Member since:
    Mar 2010

    Posted 17 Jun 2011 Link to this post

    Hi Kalina

    One query
    Can we do all the stuff that is dont in Javascript to c#?

    Karthik.K
  7. Kalina
    Admin
    Kalina avatar
    918 posts

    Posted 23 Jun 2011 Link to this post

    Hello Karthik Kantharaj,

    Could you please explain your implementation in more details?
    What is the exact logic that you prefer to add at server-side instead of writing it on client-side?

    Regards,
    Kalina
    the Telerik team

    Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.

  8. Karthik Kantharaj
    Karthik Kantharaj avatar
    101 posts
    Member since:
    Mar 2010

    Posted 23 Jun 2011 Link to this post

    Hi Kalina
    Thank you

    I am doing every thing on my server side and we have One class with all Telerik controls imported
    e.g

    class myCustomclass : RadComboBox
    {
    }

    So like above we are doing every thing on server side (Manager class)
    Can you please let me know how to do or any sample

    Karthik.K
  9. Kalina
    Admin
    Kalina avatar
    918 posts

    Posted 23 Jun 2011 Link to this post

    Hi Karthik Kantharaj,

    I am afraid that we do not have such example.
    In general inheriting RadComboBox class is not recommended.

    Regards,
    Kalina
    the Telerik team

    Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.

  10. Karthik Kantharaj
    Karthik Kantharaj avatar
    101 posts
    Member since:
    Mar 2010

    Posted 24 Jun 2011 Link to this post

    Hi Kalina

    Sorry to say we did with the same requirement and got the result

    Any ways thank you as the code is more secure i cannot send you the sample

    Thanks

    Karthik.K
Back to Top