Row Select & Deselect

5 posts, 0 answers
  1. Tom Lynch
    Tom Lynch avatar
    78 posts
    Member since:
    Mar 2005

    Posted 26 May 2011 Link to this post

    I'm using the client side row selection feature described here http://demos.telerik.com/aspnet-ajax/grid/examples/client/selecting/defaultcs.aspx.

    It works as described, but I wonder if I can change the behavior.  Right now, when I click on a row to select it, it deselects other rows that were selected previously.  Is it possible to cancel the deselect on all the other rows?  I'd rather a row click affect only the row that was clicked. 

    Also, if a row is already selected, and I click it, nothing happens to that row.  Could it be changed so that a click on the selected row will deselect that row?

    Tom
  2. Gimmik
    Gimmik avatar
    170 posts
    Member since:
    May 2011

    Posted 26 May 2011 Link to this post

    Hi Tom,

    I'm rather intrigued with your idea. I usually hold the Control key when I want to select multiple rows without deselecting the old one. What you propose would be handy in some situations, although it may be an unusual interface for people used to Excel style selection.

    I don't think you can do this with the built in selection functionality, but Telerik has a whole list of events that you can tie into. I would start by wiring up the client-side RowClicked event toggle a selection checkbox in a hidden column. You'll also have to make sure that clicking a row doesn't deselect any rows. I would create a global in JS called "deselectAllowed" and set it to "true" to start. When in the RowClicked event, set it to "false". Then handle the RowDeselected event and cancel the deselection if "deselectAllowed" is set to false.

    That's my idea at least. I'll have to work up a small sample to see if this is even possible. It's a fun exercise though. Personally, I would just hold Control while clicking.

    Hope this helps,
    -Gimmik
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. siddhartha
    siddhartha avatar
    4 posts
    Member since:
    May 2011

    Posted 26 May 2011 Link to this post

    Just make the AllowMultipleEdits to true or AllowMultipleSelect to true  this property will be in the radgrid property explorer
  5. Tom Lynch
    Tom Lynch avatar
    78 posts
    Member since:
    Mar 2005

    Posted 31 May 2011 Link to this post

    Gimmik, I'll have a closer look at the events and see what I can do.  I'm upgrading a legacy application that used this sort of deselecting behavior I'm describing.  Perhaps it's not standard, but it's what the users of this particular application have done for years, so I don't want to frustrate them.  If I were doing this from scratch I'd just leave it with the default behavior. 

    Tom
  6. Tom Lynch
    Tom Lynch avatar
    78 posts
    Member since:
    Mar 2005

    Posted 08 Jun 2011 Link to this post

    I have a solution for what I needed.  One thing that was tricky is the RowDeselecting event fires before all other row events.  So I cancel the RowDeselecting and RowSelecting events by default.  Then I have an RowClick event that sets a global variable with the datakey of the row that was clicked before raising the select or deselect event again.  This time the RowDeselecting/RowSelecting events compares the argument datakey with the value of the global variable.  If they match, I don't cancel the event. 

    var SelectedId = "";
    var DeselectedId = "";
      
    function RadGrid1_RowDeselecting(sender, args) {
        var Id = args.getDataKeyValue("Id");
        if (Id != DeselectedId)
            args.set_cancel(true);
        else
            DeselectedId = "";
    }
    function RadGrid1_RowSelecting(sender, args) {
        var Id = args.getDataKeyValue("Id");
        if (Id != SelectedId)
            args.set_cancel(true);
        else
            SelectedId = "";
    }
    function RadGrid1_RowClick(sender, args) {
        if (args.get_gridDataItem().get_selected()) {
            DeselectedId = args.getDataKeyValue("Id");
            args.get_gridDataItem().set_selected(false);
        } else {
            SelectedId = args.getDataKeyValue("Id");
            args.get_gridDataItem().set_selected(true);
        }
    }
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017