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

Client side find control problem

9 Answers 479 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Andy Green
Top achievements
Rank 1
Andy Green asked on 14 Dec 2009, 10:23 AM
Hi

I'm trying to use this example to have a treeview inside a combobox, all inside a grid template.

http://demos.telerik.com/aspnet-ajax/treeview/examples/functionality/treeviewcombobox/defaultcs.aspx?product=treeview

From the example this code is used to get the conmobox:
            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_value(node.get_text());  
                comboBox.commitChanges();  
 
                comboBox.hideDropDown();  
            } 

My problem is how do I get set the comboBox var with my set up.

This is also all in a Masterpage that add another layer of complexity.

To recap - I have Masterpage | Rag Grid | Edit Template | RadCombo box | RadTreeView.

Can anyone offer any help?

Andy

9 Answers, 1 is accepted

Sort by
0
Accepted
Daniel
Telerik team
answered on 14 Dec 2009, 11:13 AM
Hello Andy,

I recommend you try the findControl method. For more information about our static library, please examine the following link:
Telerik static client library

 

function nodeClicking(sender, args)
{
    var comboBox = $telerik.findControl(parentElement, "RadComboBox1");
    ...
}


Best regards,
Daniel
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
0
Andy Green
Top achievements
Rank 1
answered on 14 Dec 2009, 12:00 PM
Great thank you.

But it still not working, on load the dropdown is only 1 character high, and on clicking a value it does not appear in the combobox.

This is my page structure

Masterpage | RadGrid | edit template | Combo box | radtreeview

Andy

 

0
Daniel
Telerik team
answered on 17 Dec 2009, 06:23 PM
Hello Andy,

I'm not sure I understand your scenario completely. Could you please elaborate what do you mean by "on load the dropdown.." - do you mean the client-side pageLoad event?
 
Best regards,
Daniel
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
0
Andy Green
Top achievements
Rank 1
answered on 18 Dec 2009, 07:38 AM
Sorry for being vaugue, the problem is I cant get a value for parentElement as given in your code.

And as such none of the client side functionality is working.

Andy
0
Daniel
Telerik team
answered on 18 Dec 2009, 09:31 AM
Hello Andy,

You could use any HTML element that is parent to your combo box. This includes RadGrid DIV, MasterTableView TABLE, rows, cells, etc.

I recommend you try the following approach:
function nodeClicking(sender, args)
{
    var radGrid = $find('<%= RadGrid1.ClientID %>');
    var comboBox = $telerik.findControl(radGrid.get_element(), "RadComboBox1");
    ...
}

You can even use the document element as a parent:
function nodeClicking(sender, args)
{
    var comboBox = $telerik.findControl(document, "RadComboBox1");
    ...
}

I hope this helps.

Best regards,
Daniel
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
0
Andy Green
Top achievements
Rank 1
answered on 18 Dec 2009, 11:07 AM
Thanks Daniel

This nearly works but there is a frustrating error.

The dropdown loads OK, My problem with the control only being 1 row high was because I'd not set a height, but I am setting in code behind that the treeview start with expanded nodes - this is not happening.

What I get now, and I've been playing all morning is a javascrip error 'unexpected call to method or property access'.

The tree works fine, but I cant release the code with this error. Interestingly I eneded up removing all code from the function stubs and obviously  it stopped working, but threw the same error.

UpDate - seems to work on Firefox, I'm on IE 6.

Andy
0
Daniel
Telerik team
answered on 19 Dec 2009, 07:03 PM
Hello Andy,

I recommend you follow these steps:
- try the latest version of RadControls for ASP.NET AJAX and if the error still persists
- send a simple runnable project so I can debug it on my end

Thank you for your cooperation

Best regards,
Daniel
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
0
Aimee Rasmussen
Top achievements
Rank 1
answered on 20 May 2010, 06:20 PM
This is the approach that I've been using (below) but it only finds the first instance of the combo box in the grid..  I need to get the selected row instead.. something like:

var comboBox = $telerik.findControl(radGrid.get_selectedElement(), "RadComboBox1");

but that doesn't work either.. any suggestions?  I'm sure there's a method that I'm just not finding..


function nodeClicking(sender, args)
{
    var radGrid = $find('<%= RadGrid1.ClientID %>');
    var comboBox = $telerik.findControl(radGrid.get_element(), "RadComboBox1");
    ...
}

Here's my complete code:
function nodeClicking(sender, args) {  
        var radGrid = $find('ctl00_ContentPlaceHolder1_gvTransactions_ctl00_ctl11_EditFormControl_gvSplit');  
//        var selectedItem = radGrid.get_selectedItems();  
        var comboBox = $telerik.findControl(radGrid.get_element(), "cboCategory");  
        var node = args.get_node()  
 
        comboBox.set_text(node.get_text());  
        comboBox.set_value(node.get_value());  
 
        comboBox.trackChanges();  
        comboBox.get_items().getItem(0).set_value(node.get_value());  
        comboBox.commitChanges();  
 
        comboBox.hideDropDown();  
    }  
    function StopPropagation(e) {  
        if (!e) {  
            e = window.event;  
        }  
 
        e.cancelBubble = true;  
    }  
 
    function OnClientDropDownOpenedHandler(sender, eventArgs) {  
        var treeName = "tvCategory";  
        var tree = sender.get_items().getItem(0).findControl(treeName)  
        var selectedNode = tree.get_selectedNode();  
        if (selectedNode) {  
            selectedNode.scrollIntoView();  
        }  
    } 


0
Andy Green
Top achievements
Rank 1
answered on 21 May 2010, 03:03 PM
This is my working code, Not sure I fully understand you r problem but this works - from the tree I get the ID of the node, that ID is then used to stamp the record.

Markup for the tree in a dropdown
                           <div ID="pnlLocation">  
                                  
                                    <telerik:RadComboBox ID="txtLocation" runat="server" Height="300px" Width="150px" ShowToggleImage="True" Style="vertical-align: middle;" OnClientDropDownOpened="DownOpenedHandlerLocation" EmptyMessage="Choose Location" CausesValidation="False" EnableEmbeddedSkins="False" Skin="CPSM">  
                                        <ItemTemplate> 
                                            <div onclick="StopPropagation(event)">  
                                                 <telerik:RadTreeView ID="rtvLocation" runat="server" EnableEmbeddedSkins="False" Skin="CPSM" CausesValidation="False"  OnClientNodeClicking="nodeClickingLocation" > 
                                                    <Nodes> 
                                                        <telerik:RadTreeNode runat="server" Text="None" Value=""></telerik:RadTreeNode> 
                                                    </Nodes> 
                                                 </telerik:RadTreeView> 
                                            </div> 
                                        </ItemTemplate> 
                                        <Items> 
                                            <telerik:RadComboBoxItem Text="" /> 
                                        </Items> 
                                      </telerik:RadComboBox> 
                                  
                            </div> 

Javascript in the aspx page
 function nodeClickingLocation(sender, args)  
        {  
            var comboBox = $find("<%= txtLocation.ClientID %>");  
            var node = args.get_node()  
            comboBox.set_text(node.get_text());  
            comboBox.trackChanges();  
            comboBox.get_items().getItem(0).set_value(node.get_text());  
            comboBox.get_items().getItem(0).get_attributes().setAttribute("nodeValue", node.get_value());  
            comboBox.commitChanges();  
            comboBox.hideDropDown();  
        }  
 
        function DownOpenedHandlerLocation(sender, eventArgs)  
        {  
            var tree = sender.get_items().getItem(0).findControl("rtvLocation");  
            var selectedNode = tree.get_selectedNode();  
            if (selectedNode)  
            {  
                selectedNode.scrollIntoView();  
            }  
        } 


Code behind
Location_ID = CInt(Me.txtLocation.Items(0).Attributes("nodeValue")) 

Hope you can make some sense of this.

Andy
Tags
Grid
Asked by
Andy Green
Top achievements
Rank 1
Answers by
Daniel
Telerik team
Andy Green
Top achievements
Rank 1
Aimee Rasmussen
Top achievements
Rank 1
Share this question
or