Single row selection using checkbox in radgrid

[Soumya]

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

[Jayesh Goyani]

Hello,

<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

[Soumya]

Thanks Jayesh for the answer.
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>

aspx.cs

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);");
                 }
             }

[Jayesh Goyani]

Hello,

Have you added jquery in your page?

Thanks,
Jayesh Goyani

[Jayesh Goyani]

Hello,

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

[Soumya]

Thanks  Jayesh.
It works with jQuery in my code after adding jQuery.

Thanks,
Soumya