How can I select a single row in Radgrid using checkbox? I am using gridtemplate column to show checkbox in the grid as below.
<
telerik:GridTemplateColumn
AllowFiltering
=
"false"
>
<
ItemTemplate
>
<
asp:CheckBox
runat
=
"server"
ID
=
"CheckBoxColumn"
OnCheckedChanged
=
"CheckBoxColumn_CheckedChanged"
AutoPostBack
=
"true"
/>
</
ItemTemplate
>
</
telerik:GridTemplateColumn
>
But here I need to select only a single row in the grid.While checking a checkbox,I need to uncheck the previously checked checkbox in grid.
Please help me on this.
Thanks,
Soumya
5 Answers, 1 is accepted
0

Jayesh Goyani
Top achievements
Rank 2
answered on 30 Aug 2012, 01:17 PM
Hello,
I have used Jquery. Do not forget to add in your page.
Thanks,
Jayesh Goyani
<
telerik:RadGrid
ID
=
"RadGrid1"
runat
=
"server"
AutoGenerateColumns
=
"false"
OnNeedDataSource
=
"RadGrid1_NeedDataSource"
AllowPaging
=
"true"
PageSize
=
"10"
OnItemDataBound
=
"RadGrid1_ItemDataBound"
>
<
MasterTableView
CommandItemDisplay
=
"Top"
DataKeyNames
=
"ID"
>
<
Columns
>
<
telerik:GridTemplateColumn
UniqueName
=
"TemplateColumn"
>
<
ItemTemplate
>
<
asp:CheckBox
ID
=
"checkColumn"
runat
=
"server"
/>
</
ItemTemplate
>
</
telerik:GridTemplateColumn
>
<
telerik:GridBoundColumn
HeaderText
=
"ID"
DataField
=
"ID"
UniqueName
=
"ID"
>
</
telerik:GridBoundColumn
>
<
telerik:GridEditCommandColumn
>
</
telerik:GridEditCommandColumn
>
</
Columns
>
</
MasterTableView
>
<
ClientSettings
>
</
ClientSettings
>
</
telerik:RadGrid
>
function
uncheckOther(chk) {
var
status = chk.checked;
var
checkBoxes = $(
"input[id*='checkColumn']"
);
$.each(checkBoxes,
function
() {
$(
this
).attr(
'checked'
,
false
);
});
chk.checked = status;
}
protected
void
RadGrid1_NeedDataSource(
object
sender, GridNeedDataSourceEventArgs e)
{
dynamic data =
new
[] {
new
{ ID = 1, Name =
"Name1"
},
new
{ ID = 2, Name =
"Name2"
},
new
{ ID = 3, Name =
"Name3"
}
};
RadGrid1.DataSource = data;
}
protected
void
RadGrid1_ItemDataBound(
object
sender, GridItemEventArgs e)
{
if
(e.Item
is
GridDataItem)
{
GridDataItem item = e.Item
as
GridDataItem;
CheckBox checkColumn = item.FindControl(
"checkColumn"
)
as
CheckBox;
checkColumn.Attributes.Add(
"onclick"
,
"uncheckOther(this);"
);
}
}
I have used Jquery. Do not forget to add in your page.
Thanks,
Jayesh Goyani
0

Soumya
Top achievements
Rank 1
answered on 30 Aug 2012, 02:41 PM
Thanks Jayesh for the answer.
I have tried your code.It doesn't work at my side
Please find my markup:
aspx.cs
I have tried your code.It doesn't work at my side
Please find my markup:
<
script
type
=
"text/javascript"
>
function uncheckOther(chk) {
var status = chk.checked;
var checkBoxes = $("input[id*='CheckBoxColumn']");
$.each(checkBoxes, function () {
$(this).attr('checked', false);
});
chk.checked = status;
}
</
script
>
<
telerik:RadGrid
ID
=
"gvPatientList"
runat
=
"server"
AllowFilteringByColumn
=
"True"
AllowPaging
=
"True"
PageSize
=
"4"
OnItemDataBound
=
"gvPatientList_ItemDataBound"
>
<
PagerStyle
Mode
=
"NextPrevAndNumeric"
AlwaysVisible
=
"true"
/>
<
GroupingSettings
CaseSensitive
=
"false"
/>
<
ItemStyle
HorizontalAlign
=
"Left"
/>
<
HeaderStyle
HorizontalAlign
=
"Left"
/>
<
AlternatingItemStyle
HorizontalAlign
=
"Left"
/>
<
ClientSettings
EnablePostBackOnRowClick
=
"true"
>
</
ClientSettings
>
<
MasterTableView
AutoGenerateColumns
=
"False"
DataKeyNames
=
"pt_regid"
>
<
CommandItemTemplate
>
<
asp:PlaceHolder
ID
=
"PlaceHolder1"
runat
=
"server"
></
asp:PlaceHolder
>
</
CommandItemTemplate
>
<
Columns
>
<
telerik:GridTemplateColumn
AllowFiltering
=
"false"
>
<
ItemTemplate
>
<
asp:CheckBox
runat
=
"server"
ID
=
"CheckBoxColumn"
OnCheckedChanged
=
"CheckBoxColumn_CheckedChanged"
AutoPostBack
=
"true"
/>
</
ItemTemplate
>
</
telerik:GridTemplateColumn
>
<
telerik:GridBoundColumn
HeaderText
=
"Payer"
UniqueName
=
"CDName"
DataField
=
"CDName"
AllowFiltering
=
"false"
>
</
telerik:GridBoundColumn
>
<
telerik:GridBoundColumn
HeaderText
=
"Card No"
UniqueName
=
"Fld_InsAppNo"
DataField
=
"Fld_InsAppNo"
AllowFiltering
=
"false"
>
</
telerik:GridBoundColumn
>
<
telerik:GridBoundColumn
HeaderText
=
"Plan"
UniqueName
=
"PolicyName"
DataField
=
"PolicyName"
AllowFiltering
=
"false"
>
</
telerik:GridBoundColumn
>
<
telerik:GridBoundColumn
HeaderText
=
"Expiry Date"
UniqueName
=
"EndDt"
DataField
=
"EndDt"
AllowFiltering
=
"false"
>
</
telerik:GridBoundColumn
>
</
Columns
>
</
MasterTableView
>
<
HeaderContextMenu
EnableImageSprites
=
"True"
CssClass
=
"GridContextMenu GridContextMenu_Default"
>
</
HeaderContextMenu
>
</
telerik:RadGrid
>
protected
void
gvPatientList_ItemDataBound(
object
sender, GridItemEventArgs e)
{
if
(e.Item
is
GridDataItem)
{
GridDataItem item = e.Item
as
GridDataItem;
CheckBox checkColumn = item.FindControl(
"CheckBoxColumn"
)
as
CheckBox;
checkColumn.Attributes.Add(
"onclick"
,
"uncheckOther(this);"
);
}
}
0

Jayesh Goyani
Top achievements
Rank 2
answered on 30 Aug 2012, 02:47 PM
Hello,
Have you added jquery in your page?
Thanks,
Jayesh Goyani
Have you added jquery in your page?
Thanks,
Jayesh Goyani
0

Jayesh Goyani
Top achievements
Rank 2
answered on 30 Aug 2012, 02:51 PM
Hello,
Please also try with below code.
Only replace js code in above code.
Thanks,
Jayesh Goyani
Please also try with below code.
Only replace js code in above code.
function
uncheckOther(chk) {
var
grid = $find(
"<%=RadGrid1.ClientID %>"
);
if
(grid) {
var
MasterTable = grid.get_masterTableView();
var
Rows = MasterTable.get_dataItems();
for
(
var
i = 0; i < Rows.length; i++) {
var
row = Rows[i];
var
Chk1 = $(row.get_element()).find(
"input[id*='checkColumn']"
).get(0);
if
(Chk1.id != chk.id) {
Chk1.checked =
false
;
}
}
}
}
Thanks,
Jayesh Goyani
0

Soumya
Top achievements
Rank 1
answered on 01 Sep 2012, 05:50 AM
Thanks Jayesh.
It works with jQuery in my code after adding jQuery.
Thanks,
Soumya
It works with jQuery in my code after adding jQuery.
Thanks,
Soumya