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

Select row only through checkbox but still have an active row

8 Answers 330 Views

Grid

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

Mink asked on 17 Jul 2009, 11:39 AM

Hi,

I would like to accomplish the following:
A RadGrid with allow multiple row selection, but (de)selection should only be accomplished through the checkboxes in the GridClientSelectColumn. The selected row(s) should not be highlighted. The only indication for being selected should be the checked checkbox(es). This is because I would like a row to be highlighted when an user clicks on it anywhere but the checkbox, but it should not be selected.
So checking a row's checkbox or clicking a row anywhere but the checkbox should display very distinct and seperate behavior instead of the default tightly coupled behavior.

Does anyone know how to accomplice this in a relative simple manner? Or does it interfere so much with the way the RadGrid is build that it is (nearly) impossible?

Thanks in advance for any help on this.

Cheers,

Mink

8 Answers, 1 is accepted

answered on 17 Jul 2009, 02:05 PM

Hello Mink,

The following code snippet will help you differentiate whether the CheckBox or the Row is clicked on. Then depending on your requirement change the background color of the row or select the row, respectively:

JavaScript:

    
            <script type="text/javascript"> 
        
            function OnRowSelected(sender, args) 
        
            { 
        
                var e = args.get_domEvent(); 
        
                //IE - srcElement, Others - target 
        
                var targetElement = e.srcElement || e.target;                 
        
                //is the clicked element an input checkbox? <input type="checkbox"...> 
        
                if(targetElement.tagName.toLowerCase() != "input" && (!targetElement.type || targetElement.type.toLowerCase() != "checkbox"))// && currentClickEvent) 
        
                { 
        
                    alert("Clicked on Row"); 
        
                } 
        
                else 
        
                { 
        
                    alert("Clicked on CheckBox"); 
        
                } 
        
            } 
        
            </script>

Thanks
Princy.

answered on 23 Jul 2009, 01:22 PM

There hasn't been a reaction on this post for a while now. I'm still hoping someone has a solution.

To be clear, I'm already to the point where a row is only (de)selected if it's checkbox is (un)checked and not when the row is clicked anywhere but the checkbox using

    
                var e = args.get_domEvent(); 
        
                //IE - srcElement, Others - target   
        
                var targetElement = e.srcElement || e.target; 
        
                //this condition is needed if multi row selection is enabled for the grid 
        
                if (typeof (targetElement) != "undefined") { 
        
                    //is the clicked element an input checkbox? (<input type="checkbox"...>) 
        
                    if (targetElement.tagName.toLowerCase() != "input" && 
        
                        (!targetElement.type || targetElement.type.toLowerCase() != "checkbox")) { 
        
                        //cancel the event 
        
                        args.set_cancel(true); 
        
                        //but do highlight please! 
        
                    else { 
        
                        //no highlighting please! 
        
                    } 
        
                } else { 
        
                    args.set_cancel(true); 
        
                }

.
My problem lies with avoiding highlighting when selecting a row (checking the checkbox) and do getting highlighting when just clicking a row. Of coarse, when a row is clicked (not selected) only that row should be highlighted and so the previously highlighted row should be de-highlighted.
I would prefer a solution that doesn't involve intricate knowledge of the css classes involved because I imagine that if I use a different skin for the grid I'll have to change my script as well, which is bound to go wrong. So it would be great if this could be solved through the client-side api and events.

Regards,

Mink

answered on 31 Aug 2009, 02:52 PM

Dear Sebastian,

Correct me if I'm wrong, but I'm under the impression that the code you're referring to is exactly the code I've already implemented, as I stated in my post of july the 23st.

To be very clear, this is what I would like to achieve:
- Click on the checkbox of a row:
The checkbox is (de)selected and the row is added/removed to/from the collection of selected items. (So far, so good.)
But!, the row should NOT be highlighted.

- Click on a row anywhere but the checkbox:
Absolutely NO selecting of the row. (Again, so far, so good.)
But!, the row should be HIGHLIGHTED. (Only the row just clicked and no other.)

So my problem lies with the HIGHLIGHTING part.

If the code you referred to does include a solution for my highlighting problem please let me know.
If not, I hope that you (or someone else) do know a solution for my highlighting problem.

Regards,

Mink