Client-side row selecting with EditMode "InPlace"

[Reggy]

Hello,

I'm creating a RadGrid from code-behind. I've got a client-side row selection event (which causes a postback) and I'd like to use the InPlace edit mode of the grid. The problem is when the grid is in edit mode, I can still select rows client-side and cause a postback.

So my question is if I can somehow prevent client-side row selections when there's an editable row in the grid?

I'm not sure if this is related, but I found an old post on this forum about the InPlace edit mode and using the OnRowSelected client event:
http://www.telerik.com/community/forums/aspnet/grid/handle-onrowselected-client-event-when-the-item-was-been-editting.aspx

A post from Telerik states:
After further investigation this seems to be a limitation of the InPlace edit mode. When working in this mode the column can not be selected. As a workaround I can suggest you to see the implementation of server-side selection in this example which might give you a hint on how to achieve your goal.
Source: http://www.telerik.com/community/forums/aspnet/grid/handle-onrowselected-client-event-when-the-item-was-been-editting.aspx#639338

Is that post still relevant today? Either way, the original question still stands!

Regards,
Reggy

[Reggy]

No responses? Anyone? ...hello? :(

[Princy]

Hello Reggy,

The following code snippet shows how to prevent selecting a row when that row is in edit mode.

Java Script:

<script type="text/javascript">    function btnclick(checkbox) {
      function RowSelecting(sender, args) {
       var count = sender._editIndexes[0];
         if (count >= 0) {
            if (count == args._itemIndexHierarchical) {
                args.set_cancel(true);
              }
        }
    }
</script>

Thanks,
Princy.

[Reggy]

Hello,

Thanks for the response.

The thing is, when I call args.set_cancel(true) the only thing that happens is that the row does not get selected client-side, but the postback still happens. 

Regards,
Reggy

[Iana Tsolova]

Hello Reggy,

Can you specify if you have set the EnablePostBackOnRowClick property in the grid ClientSettings to true?
I suggest that you turn it back to false. Then handle the OnRowSelected event. There first check if the item is in edit mode using the get_isIniEditMode() method. And only in the case this is false, put the item in edit mode using the editItem() method for instance.

Kind regards,
Iana
the Telerik team

[Reggy]

Hello,

Thank you for the response. Yes, I had EnablePostBackOnRowClick set to 'true'. I will admit I have not yet tried to implement your suggestion, because it still sounds like it will not solve the problem of users selecting a different row while they have a row already in edit mode.

At the moment I have solved it a little differently.

I have set the EnablePostBackOnRowClick to 'false'. I've hooked up the 'OnRowSelecting' and 'OnRowClick' client-events to the grid. If I detect there's a row in edit-mode, I simply cancel everything. If no rows are in edit-mode at all, I will manually cause a postback in the 'OnRowClick' event.

    ClientScript.RegisterClientScriptBlock(this.GetType(), "OnRowSelecting",
@"function RowSelecting(sender, args) {
if (IsGridInEditMode()) args.set_cancel(true);
}", true);

ClientScript.RegisterClientScriptBlock(this.GetType(), "OnRowClick",
@"function RowClick(sender, args) {
if (!IsGridInEditMode()) {
var p = $find('myTabStrip');
        if (p && p.tabs && p.tabs[0]) p.tabs[0].clickTab();
" + ClientScript.GetPostBackEventReference(this.grid, "") + @"
}
}", true);

You will notice, both of these functions call another JScript function to detect if I have a row in my grid that's in edit mode:

ClientScript.RegisterClientScriptBlock(this.GetType(), "GridEditModeDetection",
@"function IsGridInEditMode(sender, args) {
var isInEditMode = false;
var grid = $find('" + this.grid.ClientID + @"');
var tableView = grid.get_masterTableView();

for (var i = 0; i < tableView.get_dataItems().length; i++) {
var item = tableView.get_dataItems()[i];
if (item.get_isInEditMode()) {
isInEditMode = true;
break;
}
}

return isInEditMode;
}", true);

This isn't really to my liking, but it's the best way I could come up with to prevent a user to select any row in the grid when the grid already has a row in edit mode. I would have expected the grid to have a method for this, but in the documentation I could only find the get_isInEditMode() on an item.

Perhaps a good idea for a feature request, a function or property on the grid or master tableview to detect whether it has any item in edit-mode? :-)

Kind regards,
Reggy

[Iana Tsolova]

Hi Reggy,

Thank you for sharing your solution with community.
I also can confirm the approach you are using is right. And I will forward your request for the client property to our developers so they consider implementing it.

Regards,
Iana
the Telerik team