Checkbox - select all on ALL pages?

11 posts, 0 answers
  1. Michael
    Michael avatar
    12 posts
    Member since:
    Oct 2017

    Posted 07 Nov Link to this post

    One of our Grids is basically a build your own query page and can often return upwards of 50 pages of 50 items.

    We want the select all checkbox to select all the items across all the returned pages. However, the default functionality is to only select what's on the current page.

    The official workaround is to temporarily set the page size to that of the datasource.data().length, select all the items, then return the page size to what it was previously.

    The problem is that grid.dataSource.pageSize() doesn't return a promise. It only returnsthe current page size... asynchronously and instantly. The example shown for the workaround, as far as I can tell, could never have worked.

    Does anyone have a solution to selecting all items when you have several pages of data?

  2. Preslav
    Admin
    Preslav avatar
    247 posts

    Posted 10 Nov Link to this post

    Hi Michael,

    Based on your post, I am not sure what is not working as expected.

    Having said that, could you please prepare and share a sample runnable project in a Dojo that clearly demonstrates the issue? This Dojo will help us fully understand the scenario and we will be able to provide assistance to the best of our knowledge. For the example, feel free to use dummy data.

    I look forward to your reply.


    Regards,
    Preslav
    Progress Telerik
    Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
  3. Michael
    Michael avatar
    12 posts
    Member since:
    Oct 2017

    Posted 10 Nov Link to this post

    I believe it's working as intended within the limitations of the model. I can demonstrate using the demo page found here:

    https://demos.telerik.com/aspnet-mvc/grid/checkbox-selection

     

    When you click the master check box in the top left it selects all the items on the current page. Other pages' rows won't be selected. So if you click the master checkbox on page 2 you won't selected items on page 1 or 3+.

    I want a simple non-hacky way to have all rows on all pages selected when that master check box is clicked.

    Is this possible?

  4. Michael
    Michael avatar
    12 posts
    Member since:
    Oct 2017

    Posted 10 Nov Link to this post

    I believe it is working as intended but only as a result of a limitation within the pagination model. I can demonstrate using the demo page here:

    https://demos.telerik.com/aspnet-mvc/grid/checkbox-selection

     

    When clicking the master check box in the top left you select all the items on the current page. If you click it on page 1 then page 2+ aren't affected.

    I want a non-hacky and relatively simple way to click that checkbox and have it selected all rows on all pages.

     

    Is this possible?

  5. Michael
    Michael avatar
    12 posts
    Member since:
    Oct 2017

    Posted 10 Nov Link to this post

    I believe it is working as intended but only as a result of a limitation within the pagination model. I can demonstrate using the demo page here:
    https://demos.telerik.com/aspnet-mvc/grid/checkbox-selection

    When clicking the master check box in the top left you select all the items on the current page. If you click it on page 1 then page 2+ aren't affected.
    I want a non-hacky and relatively simple way to click that checkbox and have it selected all rows on all pages.

    Is this possible?

  6. Michael
    Michael avatar
    12 posts
    Member since:
    Oct 2017

    Posted 10 Nov Link to this post

    I can't seem to post for some reason.
  7. Michael
    Michael avatar
    12 posts
    Member since:
    Oct 2017

    Posted 10 Nov in reply to Michael Link to this post

    I believe it is working as intended but only as a result of a limitation within the pagination model. I can demonstrate using the demo page here:
    https://demos.telerik.com/aspnet-mvc/grid/checkbox-selection

    When clicking the master check box in the top left you select all the items on the current page. If you click it on page 1 then page 2+ aren't affected.
    I want a non-hacky and relatively simple way to click that checkbox and have it selected all rows on all pages.

    Is this possible?

  8. Michael
    Michael avatar
    12 posts
    Member since:
    Oct 2017

    Posted 10 Nov in reply to Michael Link to this post

    I believe it is working as intended but only as a result of a limitation within the pagination model. I can demonstrate using the demo page here:
    https://demos.telerik.com/aspnet-mvc/grid/checkbox-selection

    When clicking the master check box in the top left you select all the items on the current page. If you click it on page 1 then page 2+ aren't affected.
    I want a non-hacky and relatively simple way to click that checkbox and have it selected all rows on all pages.

    Is this possible?

  9. Michael
    Michael avatar
    12 posts
    Member since:
    Oct 2017

    Posted 10 Nov in reply to Michael Link to this post

    I believe it is working as intended but only as a result of a limitation within the pagination model. I can demonstrate using the demo page here:


    When clicking the master check box in the top left you select all the items on the current page. If you click it on page 1 then page 2+ aren't affected.
    I want a non-hacky and relatively simple way to click that checkbox and have it selected all rows on all pages.

    Is this possible?

  10. Michael
    Michael avatar
    12 posts
    Member since:
    Oct 2017

    Posted 10 Nov Link to this post

    There are problems with your reply feature built into the notification emails

    The thread page it linked to was giving errors on all my posts besides the one saying that I was unable to post - which ironically worked. When manually pulling up the thread on the forum I saw all the failed posts actually went through - including those before and after the one saying I couldn't post.

  11. Preslav
    Admin
    Preslav avatar
    247 posts

    Posted 4 days and 21 hours ago Link to this post

    Hello Michael,

    I am afraid that there is no non-hacky solution to achieve the desired behavior.

    A possible workaround is the one in your first post.

    Another possible workaround might be handling the click event on the master checkbox and based on a condition empty or add all IDs to the _selectedIds internal grid object. For example:

    function onClick(e) {            
      var grid = $("#grid").data("kendoGrid");
      var dataSource = grid.dataSource;
      var total = dataSource.total();
                 
      if (dataSource.pageSize() === grid.select().length) {
        grid._selectedIds = {};
      } else {         
        for(var i=1;i<=total;i++){
          grid._selectedIds[i]=true;
        };
      }
    };

    For a runnable example, check this Dojo: https://dojo.telerik.com/iMUXO/2

    However, to use the above approach, you should make sure that the IDs in the dataSource match the numbers from 1 to the length of the records.

    I hope this helps.


    Regards,
    Preslav
    Progress Telerik
    Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
Back to Top