Hi!
I am using Telerik's Radgrid in EditMode="Batch" and with EditType="Cell" settings. The Grid contains both GridBoundColumn(s) and GridTemplateColumn(s) with DropDownLists.
What i want to achieve (on client side) is when a user changes the value in a dropdown list (contained in an GridTemplateColumn), i will be able and update some session variables depending on the values of multiple other column values of the grid.
Up to know i was able to do everything i wanted using the code behind event handlers but this scenario requires handling some of the event on the client side, so i am struggling with javascript :) which is not really my expertise.
I am using the OnBatchEditOpen & OnBatchEditClosed client events off the grid.
What i am trying to achieve is when a cell (Columns that expose dropdown lists are: Segment, Basis, Side) is clicked for editting (OnBatchEditOpen) to be able and also fetch the values of some other columns on the same row.
Here is my grid code:
<
telerik:RadGrid
RenderMode
=
"Lightweight"
runat
=
"server"
ID
=
"RadGridLesions"
AllowPaging
=
"True"
AllowSorting
=
"True"
AutoGenerateColumns
=
"False"
Skin
=
"BlackMetroTouch"
CssClass
=
"dark-grey"
OnNeedDataSource
=
"RadGridLesions_NeedDataSource"
ShowStatusBar
=
"True"
AllowAutomaticInserts
=
"False"
AllowAutomaticDeletes
=
"True"
AllowAutomaticUpdates
=
"True"
OnItemUpdated
=
"RadGridLesions_ItemUpdated"
OnItemDeleted
=
"RadGridLesions_ItemDeleted"
OnBatchEditCommand
=
"RadGridLesions_BatchEditCommand"
>
<
MasterTableView
CommandItemDisplay
=
"Top"
EditMode
=
"Batch"
>
<
PagerStyle
/>
<
BatchEditingSettings
SaveAllHierarchyLevels
=
"false"
HighlightDeletedRows
=
"false"
EditType
=
"Cell"
OpenEditingEvent
=
"Click"
/>
<
Columns
>
<
telerik:GridBoundColumn
DataField
=
"Segment"
UniqueName
=
"Segment"
HeaderText
=
"Segment"
DataType
=
"System.String"
HeaderStyle-HorizontalAlign
=
"Center"
ItemStyle-HorizontalAlign
=
"Center"
Visible
=
"true"
ReadOnly
=
"true"
>
</
telerik:GridBoundColumn
>
<
telerik:GridBoundColumn
DataField
=
"Level"
UniqueName
=
"Level"
HeaderText
=
"Level"
DataType
=
"System.String"
HeaderStyle-HorizontalAlign
=
"Center"
ItemStyle-HorizontalAlign
=
"Center"
Visible
=
"true"
ReadOnly
=
"true"
>
</
telerik:GridBoundColumn
>
<
telerik:GridBoundColumn
DataField
=
"Side"
UniqueName
=
"Side"
HeaderText
=
"Side"
DataType
=
"System.String"
HeaderStyle-HorizontalAlign
=
"Center"
ItemStyle-HorizontalAlign
=
"Center"
Visible
=
"true"
ReadOnly
=
"true"
>
</
telerik:GridBoundColumn
>
<
telerik:GridBoundColumn
DataField
=
"T2Grade"
UniqueName
=
"T2Grade"
HeaderText
=
"T2"
DataType
=
"System.Int32"
HeaderStyle-HorizontalAlign
=
"Center"
ItemStyle-HorizontalAlign
=
"Center"
Visible
=
"false"
ReadOnly
=
"false"
>
</
telerik:GridBoundColumn
>
<
telerik:GridTemplateColumn
HeaderText
=
"T2"
HeaderStyle-Width
=
"70px"
UniqueName
=
"T2Grade"
DataField
=
"T2Grade"
>
<
ItemTemplate
>
<%# Eval("T2Grade") %>
</
ItemTemplate
>
<
EditItemTemplate
>
<
telerik:RadDropDownList
RenderMode
=
"Lightweight"
runat
=
"server"
ID
=
"T2GradeDropDownList"
AutoPostBack
=
"false"
OnSelectedIndexChanged
=
"T2GradeDropDownList_SelectedIndexChanged"
OnClientItemSelected
=
"T2GradeDropDownList_OnClientItemSelected"
Skin
=
"BlackMetroTouch"
SelectedValue='<%# Eval("T2Grade") %>'>
<
Items
>
<
telerik:DropDownListItem
Text
=
"X"
Value
=
"0"
/>
<
telerik:DropDownListItem
Text
=
"1"
Value
=
"1"
/>
<
telerik:DropDownListItem
Text
=
"2"
Value
=
"2"
/>
<
telerik:DropDownListItem
Text
=
"3"
Value
=
"3"
/>
<
telerik:DropDownListItem
Text
=
"4"
Value
=
"4"
/>
<
telerik:DropDownListItem
Text
=
"5"
Value
=
"5"
/>
</
Items
>
</
telerik:RadDropDownList
>
</
EditItemTemplate
>
</
telerik:GridTemplateColumn
>
<
telerik:GridBoundColumn
DataField
=
"DWIGrade"
UniqueName
=
"DWIGrade"
HeaderText
=
"DWI"
DataType
=
"System.String"
HeaderStyle-HorizontalAlign
=
"Center"
ItemStyle-HorizontalAlign
=
"Center"
Visible
=
"false"
ReadOnly
=
"false"
>
</
telerik:GridBoundColumn
>
<
telerik:GridTemplateColumn
HeaderText
=
"DWI"
HeaderStyle-Width
=
"70px"
UniqueName
=
"DWIGrade"
DataField
=
"DWIGrade"
>
<
ItemTemplate
>
<%# Eval("DWIGrade") %>
</
ItemTemplate
>
<
EditItemTemplate
>
<
telerik:RadDropDownList
RenderMode
=
"Lightweight"
runat
=
"server"
ID
=
"DWIGradeDropDownList"
Skin
=
"BlackMetroTouch"
SelectedValue='<%# Bind("DWIGrade") %>'>
<
Items
>
<
telerik:DropDownListItem
Text
=
"X"
Value
=
"0"
/>
<
telerik:DropDownListItem
Text
=
"1"
Value
=
"1"
/>
<
telerik:DropDownListItem
Text
=
"2"
Value
=
"2"
/>
<
telerik:DropDownListItem
Text
=
"3"
Value
=
"3"
/>
<
telerik:DropDownListItem
Text
=
"4"
Value
=
"4"
/>
<
telerik:DropDownListItem
Text
=
"5"
Value
=
"5"
/>
</
Items
>
</
telerik:RadDropDownList
>
</
EditItemTemplate
>
</
telerik:GridTemplateColumn
>
<
telerik:GridBoundColumn
DataField
=
"DCEGrade"
UniqueName
=
"DCEGrade"
HeaderText
=
"DCE"
DataType
=
"System.Int32"
HeaderStyle-HorizontalAlign
=
"Center"
ItemStyle-HorizontalAlign
=
"Center"
Visible
=
"false"
ReadOnly
=
"false"
>
</
telerik:GridBoundColumn
>
<
telerik:GridTemplateColumn
HeaderText
=
"DCE"
HeaderStyle-Width
=
"70px"
UniqueName
=
"DCEGrade"
DataField
=
"DCEGrade"
>
<
ItemTemplate
>
<%# Eval("DCEGrade") %>
</
ItemTemplate
>
<
EditItemTemplate
>
<
telerik:RadDropDownList
RenderMode
=
"Lightweight"
runat
=
"server"
ID
=
"DCEGradeDropDownList"
Skin
=
"BlackMetroTouch"
SelectedValue='<%# Bind("DCEGrade") %>'>
<
Items
>
<
telerik:DropDownListItem
Text
=
"X"
Value
=
"0"
/>
<
telerik:DropDownListItem
Text
=
"+"
Value
=
"1"
/>
<
telerik:DropDownListItem
Text
=
"-"
Value
=
"2"
/>
</
Items
>
</
telerik:RadDropDownList
>
</
EditItemTemplate
>
</
telerik:GridTemplateColumn
>
<
telerik:GridBoundColumn
DataField
=
"PiradGrade"
UniqueName
=
"PiradGrade"
HeaderText
=
"Pirad"
DataType
=
"System.Int32"
HeaderStyle-HorizontalAlign
=
"Center"
ItemStyle-HorizontalAlign
=
"Center"
Visible
=
"true"
ReadOnly
=
"true"
>
</
telerik:GridBoundColumn
>
<
telerik:GridBoundColumn
DataField
=
"Width"
UniqueName
=
"Width"
HeaderText
=
"Width"
DataType
=
"System.Double"
Visible
=
"true"
ReadOnly
=
"false"
>
</
telerik:GridBoundColumn
>
<
telerik:GridBoundColumn
DataField
=
"Height"
UniqueName
=
"Height"
HeaderText
=
"Height"
DataType
=
"System.Double"
Visible
=
"true"
ReadOnly
=
"false"
>
</
telerik:GridBoundColumn
>
<
telerik:GridBoundColumn
DataField
=
"Comments"
UniqueName
=
"Comments"
HeaderText
=
"Comments"
DataType
=
"System.String"
Visible
=
"true"
ReadOnly
=
"false"
>
</
telerik:GridBoundColumn
>
<
telerik:GridButtonColumn
ConfirmText
=
"Delete this Row?"
ConfirmDialogType
=
"Classic"
ConfirmTitle
=
"Delete"
HeaderText
=
"Delete"
HeaderStyle-Width
=
"70px"
HeaderStyle-CssClass
=
"studies-header delete"
ItemStyle-CssClass
=
"studies-items delete"
CommandName
=
"Delete"
Text
=
"Delete"
UniqueName
=
"DeleteStudy"
>
</
telerik:GridButtonColumn
>
</
Columns
>
</
MasterTableView
>
<
ClientSettings
>
<
ClientEvents
OnBatchEditOpened
=
"BatchEditOpened"
OnBatchEditClosed
=
"BatchEditClosed"
/>
</
ClientSettings
>
</
telerik:RadGrid
>
So what in particular i am trying to achive is that if the user clicks on the "T2Grade" dropdown list depending on the values of "Segment", "Side", "Basis" columns i will make some additional actions. So in the event i need a way to fetch clicked cell's row, other column values.
My issue is how to fetch the values of the clicked cell's row column values for "Segment", "Side" and "Basis":
function
BatchEditOpened(sender, args) {
var
tableView = sender.get_masterTableView();
var
batchEditingManager = sender.get_batchEditingManager();
var
items = tableView.get_dataItems();
if
(args.get_columnUniqueName() ===
"T2Grade"
) {
_currentDropDownCell = args.get_cell(
"T2Grade"
);
var
_currentDropDownCellValue = batchEditingManager.getCellValue(_currentDropDownCell);
//this is the value of the selected dropdown list
alert(
'T2Grade: '
+ _currentDropDownCellValue);
// how am i going to fetch the ROW index AND/OR ROW data for the other columns of the grid
// tried with args.get_row() but this is not working
// most probably because i work with: EditType="Cell"
....
}
Anybody has an idea of how to do it?