Change Active Work grid items/page

Adrian_Mataisz

How we can change the default # of items  displayed per page in the grid?  Default is set to 20, I always change to 100 but I would like to hardcoded by default to 200 at least. I also would like to see the page crumbs menu on top, to scrool down to the bottom is not very time efficient.

Thank You

Nicholas_Velich

You could accomplish both of those requirements by adding the following code in /CustomSpace/custom.js:

// This will move the pagination section above the Active Work grid, and set the default page size to 200

$(document).ready(function (){

        var url = window.location.href;

        if(url.indexOf("/View/62f452d5-66b5-429b-b2b1-b32d5562092b") > -1){ // Verify we are on the Active Work page

                setTimeout(function() { // Grid is not ready when the document is ready, so this delay is necessary

                         var grid = $('[data-role=grid]') // Get the grid object

                        if(grid.length > 0){ // If the grid object is not found for whatever reason, we don't want the page load to fail

                                grid.find(".k-grid-pager").insertBefore($(".k-grouping-header")); // Moves the pagination numbers up

                                grid.data('kendoGrid').dataSource.pageSize(200); // Sets the default page size to 200

                        }

                },1500);

        }

});



This would look like this:

Adrian_Mataisz

Thanks. I'll try this. What I have to add to the code to have the  pagination section on top as well as bottom of the page/grid?

Adrian_Mataisz

Nicholas_Velich   can pagination numbers be inserted before and after the grid?

Nicholas_Velich

Possibly, but I don't have an answer at this very moment.

insertBefore() is being used now (line 8) which moves the pagination element. You would need to find a different method which copies/clones the element instead of moving it.

Jerry_Veldhuis

Good solution @Nicholas_Velich but two relatively minor issues that you may want to be aware of:

1. When the page reloads the page flashes as the pager gets relocated
   Instead of the setTimeout, is there a way to trigger off when the grid is added to the page ?
2. you code sets the value of the page size upon page load which is a behavior change. OOB if the user changes the page size it sticks even when they navigate away/back.

I'll let you know if I find solution to these.

Nicholas_Velich

Hi Jerry,

Thanks for the feedback! This is more of a proof of concept rather than a polished solution, so it can definitely be improved further.

For (1), you could potentially do something similar to what @joivan_hedrick did here.

For (2), I don't know that there is a "is default still set" we can look to for the pagination, but you could potentially look to see if the user had any existing filters, groupings, sorting, etc, and only apply the 200 per page setting if all those other defaults were still selected (that would get you closer anyway). For example, looking to see if the user has made a custom filter would be done like this:

if($(this).data('kendoGrid').dataSource._filter == null){
        // If we are in here, that means the user never applied any kendo filtering elements. The code to change the pagination would then go here.
}

Thanks,
Nick

Roelof_Luinge

Hi,

I changed a little bit in the code so it counts for all views. But now, if a user changed the default, every time after reloading the page it is set back to 50. Is there a way to solve this?

My changed piece of code:

if(url.indexOf("/View/") > -1){ // Verify we are on ta View page