Find a html control id using javascript in a Hierarchical gridview

[n/a]

Hi,

I have 2 gridviews in a page, one hierarchical and one normal gridview.

I am using javascript to update data from one gridview row to the other.

To be able to do that, I need to find the html id of the control in each gridview:

Normal gridview: ctl00_MainContent_ctl_Score_rep_ctl01_ckIsFlag is equivalent to 

ctl00_MainContent_ctl_Rubric_GV_ctl00_ctl04_ckIsFlag in the hierarchical gridview.

In the normal gridview the 'ctl01' increment by one for each row. So if I have 3 rows, the ID will be:

'ctl00_MainContent_ctl_Score_rep_ctl01_ckIsFlag

'ctl00_MainContent_ctl_Score_rep_ctl02_ckIsFlag

'ctl00_MainContent_ctl_Score_rep_ctl03_ckIsFlag

I use the index of each row to find which control to update:

"ctl00_MainContent_ctl_Score_rep_ctl" + rowindex +"_ckIsFlag"

However in the hierarchical grid, the first row has ctl04, the second row ctl07 and the third ctl10. I don't really understand how the incrementation works. as the number of records in the detail view is 4 rows, and identical for all.

My question is how do I find out the html id control in the hierarchical gridview (ctl04, ctl07 and ctl10). Please check the attachment for more clarity.

Thank you for your help

[Attila Antal]

Hi Anne,

Telerik Controls have Client-Side APIs that you can use to achieve almost everything you need to without considering the Autogenerated IDs by the ASP.NET Framework.

Please check out the following articles:

• Get Client-side Reference to a Control Object
• RadGrid - Client-Side Programming
• Batch Editing Client-side API

I have attached a Visual Studio Sample project that shows how those client-side APIs to work with Hierarchical structure, including checkboxes. Download the sample, test it out and inspect the code to see how it is done.

I hope this will prove helpful.

Regards,
Attila Antal
Progress Telerik

[n/a]

Hi Attila,
Thank you very much for your response. 
I have managed to update one of the control (the radslider) in the hierarchical grid using the project you attached.

However I haven't been able to manage to get any non telerik controls.

I have a hiddenfield and an asp checkbox that have to be updated as well, what would be the equivalent of:
var RubricScore = $telerik.findControl(currentRubric.get_cell("TemplateColumn"), "rsScore"); (rsScore is the radSlider)
for these Controls:

Checkbox:
<asp:CheckBox ID="ckIsFlag" Checked='<%# Eval("IsFlag") %>' runat="server" ToolTip="Check the box if the answer has not been provided for the question" TabIndex="-1" onclick="ScoreValidation(this, 'ckIsFlag')" />

Hiddenfield:
<asp:HiddenField ID="hfMark" Value='<%# Eval("Mark") %>' runat="server" />

Also to get the value of these controls, would ckIsFlag.checked and hfMark.value work?

Thank you for your help

Anne

[Attila Antal]

Hi Anne,

$telerik.findControl() method only works with the Telerik Components. However, the Telerik Helper functions have a method for finding generic elements as well. 

That is the $telerik.findElement() method.

For example, add the following two asp Generic controls:

<asp:Label ID="Label1" runat="server" Text="Label"></asp:Label>
<asp:HiddenField ID="HiddenField1" runat="server" />

 

Use the following Telerik helper to find them:

var label = $telerik.findElement(document, "Label1");
var hiddenField = $telerik.findElement(document, "HiddenField1");

 

Generic components such as the Label or HiddenField do not have JavaScript objects as Telerk controls, therefore manipulating them will require generic JavaScript coding. You can also use jQuery which is a JavaScript library that was designed to facilitate client-side programming.

Regards,
Attila Antal
Progress Telerik