How to disable a checkbox in radgrid using javascript

[BRK]

Hi,

I have a Radgrid which contains one text box and one checkbox.
depending upon the value in textbox i want to disable the checkbox in the same row in RadGrid.
Please tell me how can I do it.

I tried but i cant access the correct property to disable the checkbox.
Please let me know the solutions

Bye
Thanks

[Shinu]

Hello Brk,
You can achieve this by calling the javascript function from itemDataBound event. Here is a sample code.
C#:

protected void grdEmail_ItemDataBound(object sender, Telerik.Web.UI.GridItemEventArgs e)
    {
        if (e.Item is GridDataItem)
        {
            GridDataItem item=(GridDataItem)e.Item;
           TextBox txt = (TextBox)item.FindControl("TxtBox");
           if (txt.Text == "1")//Checking for the textBox value
           {
               string executeScript = "<script language='javascript'>function f(){setCheckBox('" + e.Item.ItemIndex + "');             Sys.Application.remove_load(f);}; Sys.Application.add_load(f);</script>";
               Page.ClientScript.RegisterStartupScript(this.GetType(), "setCheckBox", executeScript );
           }
     }

Javascript:

function setCheckBox(index)
    {
       var grid = $find('<%=RadGrid1.ClientID %>');
       var masterTable = grid.get_masterTableView();
       var row = masterTable.get_dataItems()[index];
       var chkBox = row.findElement("CheckBox1");
       chkBox.disabled = true;
   }

corresponding aspx is:

<telerik:GridTemplateColumn >
 <ItemTemplate>
  <asp:CheckBox ID="CheckBox1" runat="server" Checked="true" />
  <asp:TextBox ID="TxtBox" runat="server" Text='<%#Eval("EmployeeID")%>'></asp:TextBox>
 </ItemTemplate>
</telerik:GridTemplateColumn>

Thanks,
Shinu.

[BRK]

Hi Shinu,

Its not working it is not even going into that javascript function.
Please tell me where I went wrong

[Shinu]

Hello Brk,

The code worked as expected at my end. I suppose you may not checking for the TextBox value correctly. Please make sure that you are checking for the value correctly and getting into the loop.
C#:

if (give the condition here)//Checking for the textBox value
           {
               string executeScript = "<script language='javascript'>function f(){setCheckBox('" + e.Item.ItemIndex + "');             Sys.Application.remove_load(f);}; Sys.Application.add_load(f);</script>";
               Page.ClientScript.RegisterStartupScript(this.GetType(), "setCheckBox", executeScript );
           }

Hope it helps.

Please elaborate your scenario if it doesn't help.

Thanks,
Shinu.

[BRK]

Hi Shinu,

Yes I am not taking any condition here.

My scenario is In a grid there will two check boxes if one check-box is checked the another must be disabled or Invisible,
When I am implementing the code you sent it is telling that there is conversion problem cant convert string to double.
may be due to the index we gave so there I kept .ToString() to resolve.
After that too the it is not even going to the Javascript function it is telling that setCheckBox is undefined.
These are the problems I faced.

Please let me know if you have any solutions.

[Shinu]

Hello,

Try the following code to achieve your scenario.

aspx:

<telerik:GridTemplateColumn UniqueName="ToggleButton" DataField="bool">
   <ItemTemplate>
            <asp:CheckBox ID="ChkBx1" runat="server" />
            <asp:CheckBox ID="CheckBox1" runat="server" />
   </ItemTemplate>
</telerik:GridTemplateColumn>

C#:

protected void grdEmail_ItemCreated(object sender, GridItemEventArgs e)
   {
       if (e.Item is GridDataItem)
       {
           GridDataItem item = (GridDataItem)e.Item;
           CheckBox chk = (CheckBox)item.FindControl("ChkBx1");
           chk.Attributes.Add("onclick","disable('"+e.Item.ItemIndex+"')");//ataching the click event to the checkBox and passing the index
       }
   }

JavaScript:

function disable(index)
 {
       var masterTable = $find("<%= RadGrid1.ClientID %>").get_masterTableView();
       var row = masterTable.get_dataItems()[index];
       var chk1 = row.findElement("ChkBx1");
       var chk2 = row.findElement("CheckBox1");
       if (chk1.checked)
       {
           chk2.disabled = true;
       }
       else
      {
           chk2.disabled = false;
       }
   }

Thanks,
Shinu.