How to find control ID inside the radgrid template field using java script

[waruni]

hi,

I have rad grid control and it has template Column, i want to find the control ID(e.g rtpTime)  inside the rad grid using java script.
As well as im using Master page.
Can you plz tell me the way of doing this, because this is ugent.

 <telerik:GridTemplateColumn HeaderText="Time" UniqueName="time" >
            <EditItemTemplate>
                <telerik:RadTimePicker ID="rtpTime" runat="server" >
                </telerik:RadTimePicker>
                 </EditItemTemplate>
            <ItemTemplate>
            <asp:Label ID="lbltime" runat="server" Text='<%# Eval "Time","{0:t}") %>' ></asp:Label>
            </ItemTemplate>
        </telerik:GridTemplateColumn>

Thanks
Waruni

[Shinu]

Hello Waruni,

You can use the findControl() method to get reference to client object of RadControl or ASP.NET AJAX control inside the grid row.

javascript:

    function getControl() {
        var masterTable = $find("<%=RadGrid1.ClientID%>").get_masterTableView();
        var datePicker = masterTable.get_dataItems()[0].findControl('rtpTime');// Here 0 represents the index of crow in editmode
    }

Regards,
Shinu.

[waruni]

hi,

Thank you for your quick response,
 but i got following error "Object doesn't support this property or method"  why is that ?

waruni

[Radoslav]

Hi Waruni,

Could you please elaborate a bit more on your scenario? When do you want to find the RadTimePicker control with? Do you want to get it when the edit form is open or when the user clicks the Update button or on the other actions performed by the user?

Also note that when you search for the RadTimePicker the RadGrid has to be into edit mode, otherwise the  RadTimePicker control is not rendered on the page and it can not be found on the client side.

Additionally you could check out the following code library which illustrates how to access server controls in a grid template on the client:
http://www.telerik.com/community/code-library/aspnet-ajax/grid/accessing-server-controls-in-a-grid-template-on-the-client.aspx

Regards,
Radoslav
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.

[Jugoslav]

I have the following code which is fired on ClientFileSelected event. And it's fired but i am getting the result from the else statement all the time. Meaning i cannot find the button control to be clicked.

function SubmitImage() {
            var masterTable = $find("<%=RadGrid1.ClientID %>").get_masterTableView();
            var mybutton = masterTable.get_dataItems()[0].findControl('SubmitImage');
           var hidden = masterTable.get_dataItems()[0].findControl('ImagePath');
           var radupload = masterTable.get_dataItems()[0].findControl('UploadImage');
            var fileInputs = radupload.getFileInputs();
            if (mybutton) {
                hidden.value = fileInputs[0].value;
                mybutton.click();
            } else {
            alert('Ok!');
            }
        }

ASP.NET (EditItemTemplate)

<EditItemTemplate>
    <telerik:RadButton ID="SubmitImage" runat="server" CssClass="HideUploadButtons" Text="Upload Image" OnClick="SubmitImage_Click" />
    <asp:HiddenField ID="ImagePath" runat="server" Value="" />
    <asp:Image runat="server" ID="IndicatorImage" ImageUrl="~/Images/saved.png" Visible="false" />
    <telerik:RadUpload ID="UploadImage" runat="server"
        Skin="Windows7"
        ControlObjectsVisibility="None"
        TargetFolder="~/Products"
        AllowedFileExtensions=".png, .jpg, .gif"
        OnClientFileSelected="SubmitImage"
        OverwriteExistingFiles="True" />
</EditItemTemplate>

Please notice that it has to be done while grid is in the edit mode

[Radoslav]

Hello Jugoslav,

The posted code executes its else clause every time because the masterTable.get_dataItems()[0].findControl('SubmitImage') code returns always null. The findControl function could be used only for GridDataItems and not for the GridEditFormItems. In your case you can find out the edited row index by using the following client side code;

var editIndex= $find("<%=RadGrid1.ClientID %>")._editIndexes;

Then you can use a global registry (an array really) that keeps control ID's or get all elements of a given tag name and try to find the one whose ID contains our server ID.
Checkout the code library for more information : Accessing server controls in a grid template on the client

I hope this helps.

Best wishes,
Radoslav
the Telerik team