How to disable a checkbox in radgrid using javascript

6 posts, 0 answers
  1. BRK
    BRK avatar
    35 posts
    Member since:
    Jun 2012

    Posted 25 May 2011 Link to this post

    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
  2.
  3. Shinu
    Shinu avatar
    17764 posts
    Member since:
    Mar 2007

    Posted 25 May 2011 Link to this post

    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.
  5. BRK
    BRK avatar
    35 posts
    Member since:
    Jun 2012

    Posted 25 May 2011 Link to this post

    Hi Shinu,

    Its not working it is not even going into that javascript function.
    Please tell me where I went wrong
  7. Shinu
    Shinu avatar
    17764 posts
    Member since:
    Mar 2007

    Posted 26 May 2011 Link to this post

    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.
  8.
  9. BRK
    BRK avatar
    35 posts
    Member since:
    Jun 2012

    Posted 26 May 2011 Link to this post

    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.
  11. Shinu
    Shinu avatar
    17764 posts
    Member since:
    Mar 2007

    Posted 27 May 2011 Link to this post

    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.
Back to Top