This is a migrated thread and some comments may be shown as answers.

How to "un-select" a checkbox

4 Answers 138 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Timothy Ogilvie
Top achievements
Rank 1
Timothy Ogilvie asked on 07 Jan 2009, 04:55 PM
We have a grid where users can select one checkbox (multi-select is false). We're unable to uncheck the checkbox. This seems to be the default functionality, as in this example:
http://demos.telerik.com/aspnet-ajax/Grid/Examples/Client/Selecting/DefaultCS.aspx

But we want to allow users to "un-select" checkboxes by clicking a second time on the checkbox. How can we do this?

Thanks

4 Answers, 1 is accepted

Sort by
0
Shinu
Top achievements
Rank 2
answered on 08 Jan 2009, 04:47 AM
Hi Timothy,

I tried the online demo and I was able to check/uncheck the CheckBox for row selection. I guess you have trouble in deselecting a row on clicking the selected row. If so go through the following forum discussion which explains on this issue.
how to deselect a row in the radgrid

Regards
Shinu
0
Timothy Ogilvie
Top achievements
Rank 1
answered on 08 Jan 2009, 12:37 PM
Did you set multi-select equal to false in the demo (i.e. Uncheck the box at the top labeled "Allow multiple row selection")? This isn't working for me. 


0
Princy
Top achievements
Rank 2
answered on 09 Jan 2009, 08:45 AM
Hi Timothy,

I have tried this and facing the similar scenario as you said. I tried following JavaScript and got it working on my end. Please try adding following JavaScript and check if it resolves. Also add GridCreated event in RadGrid.

ASPX:
<ClientSettings> 
            <ClientEvents OnGridCreated="GridCreated"  OnRowSelected="RowSelected"/> 
            <Selecting AllowRowSelect="true" /> 
</ClientSettings> 

JavaScript:
<script type="text/javascript"
var grid; 
var ischecked=false
var ctrlId; 
function RowSelected(sender, args) 
    { 
        var e = args.get_domEvent(); 
        var targetElement = e.srcElement || e.target;       
         
       if(targetElement.tagName.toLowerCase() != "input" && (!targetElement.type || targetElement.type.toLowerCase() != "checkbox")) 
       { 
          ischecked=true;           
       } 
       else 
       {       
          if(ischecked) 
          {                
              if(ctrlId==targetElement.id) 
              { 
              document.getElementById(targetElement.id).checked=false
              ischecked=false
              masterTable=grid.get_masterTableView(); 
              masterTable.clearSelectedItems(); 
              ctrlId=targetElement.id; 
              } 
              else 
              { 
              document.getElementById(targetElement.id).checked=true
              ischecked=true
              ctrlId=targetElement.id; 
              }              
          } 
          else 
          { 
              masterTable=grid.get_masterTableView(); 
              document.getElementById(targetElement.id).checked=true
              ischecked=true
              ctrlId=targetElement.id; 
          } 
      } 
   } 
function GridCreated(sender) 
    grid = sender; 
</script> 

Thanks,
Princy.
0
Daniel
Telerik team
answered on 10 Jan 2009, 06:49 PM
Hello Timothy,

I created a sample page illustrating how to achieve the same functionality using another approach. Please find it attached to this ticket.

Kind regards,
Daniel
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.
Tags
Grid
Asked by
Timothy Ogilvie
Top achievements
Rank 1
Answers by
Shinu
Top achievements
Rank 2
Timothy Ogilvie
Top achievements
Rank 1
Princy
Top achievements
Rank 2
Daniel
Telerik team
Share this question
or