Radtreeview inside radcombobox can't change combo value clientside

4 posts, 0 answers
  1. Sergi
    Sergi avatar
    34 posts
    Member since:
    Sep 2007

    Posted 05 Jun 2012 Link to this post

    I'm using a radtreeview inside a combobox, and I'm using the following code for the OnClientNodeClicking event clientside.

    The problem is that server side btnSearch_Click event the dropdown always returns the selected value as null.

    Any help would be greatly appreciated.

    function OnRadTreeViewInComboBoxNodeClicking(sender, args) {
        var dropdownId = $('#' + sender.get_id()).closest('.RadComboBoxDropDown').attr('id').replace('_DropDown', '');
        var comboBox = $find(dropdownId);
     
        var node = args.get_node()
        comboBox.set_text(node.get_text());
     
        comboBox.trackChanges();
        comboBox.get_items().getItem(0).set_text(node.get_text());
        comboBox.get_items().getItem(0).set_value(node.get_value());
        comboBox.commitChanges();
     
        comboBox.hideDropDown();
        comboBox.attachDropDown();
     
        $('#btnSearch').click();
     
    }
  2. Princy
    Princy avatar
    17421 posts
    Member since:
    Mar 2007

    Posted 06 Jun 2012 Link to this post

    Hi Sergi,

    Here is the sample code that I tried to achieve your scenario.

    ASPX:
    <telerik:RadComboBox ID="RadComboBox1" runat="server" Width="250px" >
      <ItemTemplate>
        <div id="div1">
          <telerik:RadTreeView runat="server" ID="radtreeview1" OnClientNodeClicking="NodeClicking" Width="100%" Height="140px">
            <Nodes>
              <telerik:RadTreeNode runat="server" Text="Africa" Expanded="true" Value="1">
                <Nodes>
                  <telerik:RadTreeNode runat="server" Text="Egypt" Value="2">
                    <Nodes>
                      <telerik:RadTreeNode runat="server" Text="Cairo" Value="3">
                      </telerik:RadTreeNode>
                    </Nodes>
                  </telerik:RadTreeNode>
                  <telerik:RadTreeNode runat="server" Text="South Africa" Value="4">
                    <Nodes>
                      <telerik:RadTreeNode runat="server" Text="Cape Town" Value="5">
                      </telerik:RadTreeNode>
                    </Nodes>
                  </telerik:RadTreeNode>
                  <telerik:RadTreeNode runat="server" Text="Kenya" Value="6">
                    <Nodes>
                      <telerik:RadTreeNode runat="server" Text="Nairobi" Value="7">
                      </telerik:RadTreeNode>
                    </Nodes>
                  </telerik:RadTreeNode>
                </Nodes>
              </telerik:RadTreeNode>
            ............
            </Nodes>
          </telerik:RadTreeView>
        </div>
      </ItemTemplate>
      <Items>
        <telerik:RadComboBoxItem Text="" Value="" />
      </Items>
    </telerik:RadComboBox>
    <asp:Button ID="Submit" runat="server" OnClick="Submit_Click" Text="Submit" />

    JS:
    <script type="text/javascript">
        function NodeClicking(sender, args)
         {
            var combobox = $find("<%= RadComboBox1.ClientID %>");
            var node = args.get_node();
            combobox.set_text(node.get_text());
            combobox.trackChanges();
            combobox.get_items().getItem(0).set_text(node.get_text());
            combobox.get_items().getItem(0).set_value(node.get_value());
            combobox.commitChanges();
            combobox.hideDropDown();
         }
    </script>

    C#:
    protected void Submit_Click(object sender, EventArgs e)
        {
            Response.Write("Selected value="+RadComboBox1.SelectedValue );
            Response.Write("Selected Text=" + RadComboBox1.SelectedItem.Text);
        }

    Please provide your entire code if it doesn't helps.

    Thanks,
    Princy.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Sergi
    Sergi avatar
    34 posts
    Member since:
    Sep 2007

    Posted 06 Jun 2012 Link to this post

    Thanks, that works but it's not the problem in my scenario.

    Let me be clearer, I'm submitting the search button clientside with a jquery call in theNodeClicking event ( see last line in my OnRadTreeViewInComboBoxNodeClicking ):

    $('#btnSearch').click();

    That's when it doesn't works, when I submit the search client side.
    The code enters in the btnSearch_Click event handler server side, but the dropdown value is null.
  5. Sergi
    Sergi avatar
    34 posts
    Member since:
    Sep 2007

    Posted 08 Jun 2012 Link to this post

    I found a workaround, it seems like the radcombobox needs some time to actually store the value, so I ended up calling the search button with a timeout and now it works.

    function OnRadTreeViewInComboBoxNodeClicking(sender, args) {
        var dropdownId = $('#' + sender.get_id()).closest('.RadComboBoxDropDown').attr('id').replace('_DropDown', '');
        var comboBox = $find(dropdownId);

        var node = args.get_node()

        debug('OnRadTreeViewInComboBoxNodeClicking ' + node.get_text());

        comboBox.trackChanges();
        comboBox.set_text(node.get_text());
        comboBox.set_value(node.get_value());
        comboBox.get_items().getItem(0).set_text(node.get_text());
        comboBox.get_items().getItem(0).set_value(node.get_value());
        comboBox.commitChanges();

        comboBox.hideDropDown();
        comboBox.attachDropDown();

        setTimeout(function () { $('#btnSearch').click() }, 200);
    }
Back to Top