Checkbox in the radgrid onclick on the client side

[Nagendra]

Hi,

I have one radgrid, In this radgrid i have checkboxs, radnumerictextbox,raddatepicker and dropdownlist controls.
When i check completed checkbox in the radgrid disabled 99%Complete checkbox and percent complete radnumerictextbox value should be 100. All these actions working fine. I implemented all these action in the client side.
My problem is when i check completed checkbox in the radgrid of first page and i moved to nextpage using paging. When i back to the first page all disabled controls are now visible true.

Attached is the screen shot of radgrid with controls.

.cs file
--------------------
Protected Sub RadGrid1_ItemDataBound(ByVal sender As Object, ByVal e As GridItemEventArgs)
If TypeOf e.Item Is GridDataItem Then
            Dim item As GridDataItem = DirectCast(e.Item, GridDataItem)
            Dim txtbox As RadNumericTextBox = DirectCast(item.FindControl("pct"), RadNumericTextBox)
            Dim datepicker As RadDatePicker = DirectCast(item.FindControl("actstart"), RadDatePicker)
            Dim remdur As RadNumericTextBox = DirectCast(item.FindControl("remdurNumtxt"), RadNumericTextBox)
            Dim msdatepicker As RadDatePicker = DirectCast(item.FindControl("manstart"), RadDatePicker)
            Dim mfdatepicker As RadDatePicker = DirectCast(item.FindControl("manfinish"), RadDatePicker)
            Dim chkBox As CheckBox = DirectCast(item.FindControl("chkComplete"), CheckBox)
            Dim chkPerComp As CheckBox = DirectCast(item.FindControl("Chkbox"), CheckBox)
            chkBox.Attributes.Add("onclick", "return Completed('" + chkBox.ClientID + "','" + txtbox.ClientID + "','" + chkPerComp.ClientID + "','" + remdur.ClientID + "','" + msdatepicker.ClientID + "','" + mfdatepicker.ClientID + "')")
            chkPerComp.Attributes.Add("onclick", "return perComplete('" + chkBox.ClientID + "','" + txtbox.ClientID + "','" + chkPerComp.ClientID + "')")
        End If
End Sub

aspx page
-------------------------------
<telerik:GridTemplateColumn UniqueName="Complete" HeaderText="Completed" AllowFiltering="false">
                        <ItemTemplate>
                            <asp:Panel ID="Panel1" runat="server" Width="2px">
                                <asp:CheckBox ID="chkComplete" runat="server"/>
                            </asp:Panel>
                        </ItemTemplate>
</telerik:GridTemplateColumn>
<telerik:GridTemplateColumn UniqueName="perComplete" HeaderText="99% Complete" AllowFiltering="false">
                        <ItemTemplate>
                            <asp:Panel ID="Panel2" runat="server">
                                <asp:CheckBox ID="Chkbox" runat="server"/>
                            </asp:Panel>
                        </ItemTemplate>
 </telerik:GridTemplateColumn>
<telerik:GridTemplateColumn UniqueName="perComplete" HeaderText="Percent Complete" AllowFiltering="false">
                     <ItemTemplate>
                       <telerik:radnumerictextbox id="pct" runat="server" text='<%#Eval("pct") %>' minvalue="0" maxvalue="100" width="50px" FocusedStyle-BackColor="Yellow" NumberFormat-DecimalDigits="0">
                           <numberformat allowrounding="true" decimaldigits="4"/>  
                       </telerik:radnumerictextbox>
                     </ItemTemplate>
</telerik:GridTemplateColumn>

 <script type="text/javascript">         
           //Completed checkbox function
           function Completed(chkComp,pertxtbox,chkPercomp,remdur,msdate,mfdate) {
               var chkComplete = document.getElementById(chkComp);
               var chkPerComplete = document.getElementById(chkPercomp);
               var pertext = $find(pertxtbox);
               var radremdur = $find(remdur);
               var msdatepicker = $find(msdate);
               var mfdatepicker = $find(mfdate);
               
               if (chkComplete.checked) {
                   chkPerComplete.checked = false;
                   chkPerComplete.style.display = 'none';
                   pertext.set_value(100);
                   pertext.disable();
                   radremdur.set_visible(false);
                   msdatepicker.clear();
                   msdatepicker.set_visible(false);
                   mfdatepicker.clear();
                   mfdatepicker.set_visible(false);
               }
              }
           }
       </script>

[Princy]

Hello Nagendra,

I hope the following help documentation will help you to achieve your requirement.
Persisting the selected rows server-side on sorting/paging/filtering/grouping.

Thanks,
Princy.