Prevent RowClick action when user meant to click the select checkbox

[Ron Michael Zettlemoyer]

I have a grid with user-visible select checkboxes.  It also has a client-side event for rowclicks.  Now, it's easy for a user to accidentally miss the checkbox and click in the cell itself - which triggers the rowclick event, which I don't want.

So I'm wondering, is there a way in the rowclick even to see what cell/column index was clicked so that I don't do anything if the user clicked in the first cell/column?

[Shinu]

Hello Ron Michael,

You can refer the following Code Library which explains on how to disallow other selection than using checkbox. I guess this is what you are searching for.
ClientSideSelectColumn - Disallow other selection

Regards,
Shinu.

[Ron Michael Zettlemoyer]

Thanks for the tip, Shinu.  That is not exactly what I was looking for...  I want the user to be able to click a row and raise the RowClick event on every column except the one that the checkbox is in.  But the code that sample provides is a step in the right direction.  All I really need is a way in the RowClick (or grid "click") event to determine what cell was clicked.  Then I can cancel or ignore the click if it was the cell with the checkbox.

[Yavor]

Hi Ron,

Attached to this message, is a small application, which handles a similar setup. I hope it gets you started properly.

Sincerely yours,
Yavor
the Telerik team

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.

[Ron Michael Zettlemoyer]

Thanks for taking the time to upload that, Yavor.  But I don't think it quite addresses what I was looking for.  Based on the code,

            function clickHandler() {
                if (window.event.srcElement.type != "checkbox") {
                    shouldCancel = true;
                }
            }

it looks like you cancel the click event if the user clicked on a checkbox.  It seems like the grid already does that by itself.  I'm trying to prevent the rowclick in cases where the user happens to click anywhere else in the same cell as the checkbox.  So what I really need is to be able to determine what cell the user clicked in.

[Yavor]

Hi Ron ,

I double-tested the application in question. The behavior in question is not supplied by the control out of the box. It is achieved by the code provided in the sample. You can verify this by commenting out the client side code, and verifying that the behavior in the grid is different.
With the code in place, the control:

1. Selects a row when you click on any row, except in the cell belonging to the client select column (which hosts the checkbox)
2. Cancels out the selection when the user clicks on the cell hosting the checkbox, as per the requirement(s) which you supplied initially.

Can you confirm that you have the same behavior at your end, and that you have not included any modifications to the code?

All the best,

Yavor
the Telerik team

 

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.

[Ron Michael Zettlemoyer]

Hi Yavor,

Perhaps I wasn't 100% clear on what I was trying to achieve.  I don't want the user to be able to select the row by clicking on the row.  I want selections to be made only by clicking on the checkbox.  I already have that working with some settings changes in the control.

Now, when a user clicks a row, I need to perform an action.  So I use the RowClick event.  But I don't want to perform that action if they were simply trying to select the row with the checkbox.  If the user hits the checkbox I don't get a RowClick event.  But if they happen to miss it (which is quite easy) and click on the white space in the cell where the checkbox is located, a RowClick event is raised.  And what I want to do in the RowClick event is determine what cell/column raised the event and not perform any other action if they were clicking in the cell with the checkbox.

So I think I want to be able to do one of the following things...

1) in the RowClick event, determine what column index was clicked so I can ignore the first column.

2) in the RowClick event, get the DOM element that was actually clicked.  If I get that, I can check to see if it contains a checkbox, and then just ignore the row click.  Slower than using a column index but it would suffice.

Thanks,

Ron

[Pavlina]

Hi Ron,

You can use the get_cell() method which takes column unique name and returns the corresponding client table cell of the row.

Also, review the help article below:
Accessing cells and rows

Sincerely yours,
Pavlina
the Telerik team

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.

[Ron Michael Zettlemoyer]

Thanks Pavlina .  But how do I do that from within the rowclick event?  I don't believe the event passes me the column name or index; and unless I missed it, there is no cellclick event.  And the columnclick event is only raised when the user clicks the column header.

I'm sure once I find it, the answer will turn out to be very simple...

[Pavlina]

Hello Ron,

You can attach OnRowClick event of RadGrid and then access the cell value using getCellByColumnUniqueName method of the GridTableView client-side object:

<script type="text/javascript">
    function RowClick(sender, eventArgs) {
        var grid = sender;
        var MasterTable = grid.get_masterTableView();
        var row = MasterTable.get_dataItems()[eventArgs.get_itemIndexHierarchical()];
        var cell = MasterTable.getCellByColumnUniqueName(row, "CustomerID");
        alert(cell.innerHTML);
    }
</script>

I hope this helps.

Best wishes,
Pavlina
the Telerik team

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.