$telerik.findControl not getting selected row

[Aimee Rasmussen]

I'm trying to get a reference to a RadComboBox with a nested RadTreeView inside of a RadGrid.  I've been following your example at http://www.telerik.com/community/forums/aspnet-ajax/grid/client-side-find-control-problem.aspx which suggests using the findControl method: 

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

but this method is only returning a reference to the first instance of the combobox in the grid, not the selected record.  Seems like it would be pretty useless without someway of detecting the selected record but I cannot find any examples of how to do this.  I've tried getting a handle on the selected_Items() of the grid but that isn't working for me either.  I'm not the best at javascripting so it could be a syntax issue. 

Here's my sample script.  Currently, this code just updates the combo box text in the first row of the grid, regardless of which combobox/row i'm selecting from.  The function that's failing is nodeClicking().  Any assistance would be greatly appreciated:

 

<script type="text/javascript">

function RowDblClick(sender, eventArgs) {

sender.get_masterTableView().editItem(eventArgs.get_itemIndexHierarchical());

}



function nodeClicking(sender, args) {

if (sender.get_id().indexOf("tvAdjCategory") != -1) {

var comboBox = $find("<%= cboAdjCategory.ClientID %>");

}

else {

var radGrid = $find('<%= gvWalletTransactions.ClientID %>');

var comboBox = $telerik.findControl(radGrid.get_element(), "cboCategory");

}


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();

}

function StopPropagation(e)

{

if(!e)

{

e = window.event;

}

e.cancelBubble = true;

}


function OnClientDropDownOpenedHandler(sender, eventArgs) {

if (sender.get_id().indexOf("cboAdjCategory") != -1) {

var treeName = "tvAdjCategory";

}

else {

var treeName = "tvCategory";

}


var tree = sender.get_items().getItem(0).findControl(treeName)

var selectedNode = tree.get_selectedNode();

if (selectedNode)

{

selectedNode.scrollIntoView();

}

}

function OnLoad(sender, args) {

var combo = sender;

var input = combo.get_inputDomElement();

input.onkeydown = onKeyDownHandler;

}

function onKeyDownHandler(e) {

if (!e)

e = window.event;

// handle all keys except tab (keycode 9) other keys can be captured

if (e.keyCode != '9') {

e.returnValue = false;

if (e.preventDefault) {

e.preventDefault();

}

}

}


</script>

 

Here's a sample of my grid:

 

 <telerik:RadGrid ID="gvWalletTransactions" runat="server" AllowSorting="True" meta:resourcekey="gvTransactions"
                    AutoGenerateColumns="False" skin="Vista" font-size="X-Small" GridLines="None"
                    AllowPaging="True">
                        <MasterTableView DataKeyNames="TransactionID" GridLines="Both">
                            <Columns>
                                <telerik:GridBoundColumn DataField="TransactionID" Display="False"
                                    HeaderText="TransactionID" UniqueName="TransactionID" Visible="False">
                                </telerik:GridBoundColumn>
                                    <telerik:GridTemplateColumn DataField="TransactionDate" HeaderText="Date"
                                    UniqueName="TransactionDate">
                                    <ItemTemplate>
                                        <telerik:RadDatePicker ID="dtDate" runat="server" AutoPostBack="True" Skin="Vista"
                                            Culture="English (United States)" ShowPopupOnFocus="True" Width="60px"
                                            SelectedDate='<%# Bind("TransactionDate", "{0:d}") %>' EnableEmbeddedBaseStylesheet="False" CssClass="TextBoxAsLabel" >
                                            <Calendar UseRowHeadersAsSelectors="False" UseColumnHeadersAsSelectors="False" ViewSelectorText="x"
                                            ShowRowHeaders="false" FirstDayOfWeek="Sunday" />
                                            <DatePopupButton visible="False" HoverImageUrl="" ImageUrl="" />
                                            <DateInput DisplayDateFormat="M/d/yyyy" DateFormat="M/d/yyyy"
                                                EnableEmbeddedBaseStylesheet="False" CssClass="TextBoxAsLabel"  AutoPostBack="True" SelectionOnFocus="SelectAll">
                                            </DateInput>
                                        </telerik:RadDatePicker>
                                    </ItemTemplate>
                                    <ItemStyle HorizontalAlign="Center"/>
                                </telerik:GridTemplateColumn>
                               <telerik:GridTemplateColumn DataField="Description" HeaderText="Description"
                                    UniqueName="Description">
                                    <ItemTemplate>
                                        <Telerik:RadTextBox ID="txtDescription" runat="server"  width="250px"
                                            Text='<%# Bind("Description") %>' CssClass="TextBoxAsLabel" Skin="Vista"
                                            EnableEmbeddedBaseStylesheet="False" SelectionOnFocus="SelectAll" />
                                    </ItemTemplate>
                                </telerik:GridTemplateColumn>
                               <telerik:GridTemplateColumn DataField="Amount"
                                    HeaderText="Amount" UniqueName="Amount" SortExpression="Amount">
                                    <ItemTemplate>
                                        <telerik:RadNumericTextBox ID="txtAmount" Runat="server" Skin="Vista"
                                        Culture="English (United States)" Type="Currency" SelectionOnFocus="SelectAll"
                                        Value='<%# Bind("Amount", "{0:C}") %>' CssClass="TextBoxAsLabel" Width="50px">
                                        </telerik:RadNumericTextBox>
                                    </ItemTemplate>
                                    <ItemStyle HorizontalAlign="Center"/>
                                </telerik:GridTemplateColumn>
                                <telerik:GridTemplateColumn HeaderText="Category" UniqueName="Category" >
                                    <ItemTemplate>
                                        <telerik:RadComboBox ID="cboCategory" runat="server" Skin="Vista"
                                        OnClientDropDownOpened="OnClientDropDownOpenedHandler"
                                        meta:resourcekey="cboCategory" Width="110px" DropDownWidth="200px">
                                            <ItemTemplate>
                                                <telerik:RadTreeView ID="tvCategory" runat="server" Skin="Vista"
                                                OnClientNodeClicking="nodeClicking" >
                                                </telerik:RadTreeView>
                                            </ItemTemplate>
                                            <Items>
                                               <telerik:RadComboBoxItem Value="0"/>
                                           </Items>
                                        </telerik:RadComboBox>
                                    </ItemTemplate>
                                    <ItemStyle Wrap="False" HorizontalAlign="Center"/>
                                </telerik:GridTemplateColumn>
                                <telerik:GridTemplateColumn HeaderText="Project" UniqueName="Project"
                                    DataField="Project">
                                     <ItemTemplate>
                                        <telerik:RadComboBox runat="server" ID="cboProject" Skin="Vista" DropDownWidth="200px"
                                        meta:resourcekey="cboProject" AppendDataBoundItems="true" Width="100px">
                                            <Items>
                                                <telerik:RadComboBoxItem Value="0" />
                                            </Items>
                                        </telerik:RadComboBox>
                                    </ItemTemplate>
                                </telerik:GridTemplateColumn>
                                <telerik:GridTemplateColumn UniqueName="Account" HeaderText="Account"
                                    DataField="ToFromAccount">
                                    <ItemTemplate>
                                        <telerik:RadComboBox runat="server" ID="cboAccount" Skin="Vista" Width="100px"
                                        DropDownWidth="200px" meta:resourcekey="cboAccount" AppendDataBoundItems="true" >
                                            <Items>
                                                <telerik:RadComboBoxItem Value="0" />
                                            </Items>
                                        </telerik:RadComboBox>
                                    </ItemTemplate>
                                </telerik:GridTemplateColumn>
                                <telerik:GridTemplateColumn DataField="Flagged" UniqueName="Flagged">
                                    <ItemTemplate>
                                        <asp:ImageButton ID="btnFlagged" runat="server" meta:resourcekey="btnFlagged" onclick="imgFlagged_Click" />
                                    </ItemTemplate>
                                </telerik:GridTemplateColumn>
                            </Columns>
                            <EditFormSettings UserControlName="~/TransactionPages/UserControls/TransactionDetail.ascx" EditFormType="WebUserControl"/>
                            <HeaderStyle Font-Bold="True" HorizontalAlign="Center" Font-Italic="False" Font-Overline="False" Font-Size="Medium" Font-Strikeout="False" Font-Underline="False" />
                        </MasterTableView>
                        <ClientSettings EnableRowHoverStyle="True">
                            <Selecting AllowRowSelect="True" />
                            <ClientEvents OnRowDblClick="RowDblClick" />
                        </ClientSettings>
                    </telerik:RadGrid>

[Princy]

Hi

Try the javascript below to find the instance of  the combobox in the OnClientNodeClicking event:

<script type="text/javascript">
function OnClientNodeClickingHandler(sender, e)
{
    var id = sender.get_id();
    var index = id.indexOf("_i");
    if (index > -1)
    {
        id = id.substr(0, index);
    }
    var combo = $find(id);
}
</script>

Hope this helps.

Thanks,

Princy

[Aimee Rasmussen]

This did help, Princy.. thanks.  Here's my updated nodeClicking event for others to reference..

function nodeClicking(sender, args) {

        var id = sender.get_id();
        var index = id.indexOf("_i");
        if (index > -1) {
            id = id.substr(0, index);
        }
        var comboBox = $find(id);
        var node = args.get_node()

        comboBox.set_text(node.get_text());
        comboBox.set_value(node.get_value());

        var comboItem = new Telerik.Web.UI.RadComboBoxItem();
        comboItem.set_text(node.get_text());
        comboItem.set_value(node.get_value());

        comboBox.trackChanges();
        comboBox.get_items().add(comboItem);
        comboBox.commitChanges();
        comboBox.hideDropDown();
    }