I am trying to accomplish something and I am not sure if it is completely possible.
I have a Telerik MVC Grid using ASP.NET MVC.
The default paging size for the grid is 10, however I want to be able to adjust the size the page (the number of rows) based on the size of the user's resolution. I开发者_开发百科s this possible?
Thanks,
Paul
It is definitely possible.
I created a solution that accomplishes the same thing - however you will have to tinker with it to get the proper height of your grid on it's own (excluding any menus/headers/footers etc.)
These steps should get you there:
Firstly - you will need to add an "onLoad" event to your MVC Grid:
.ClientEvents(events =>events.OnLoad("onLoad"))
Next - Create a Javascript event to handle the "onLoad" in your $(document).ready():
function onLoad(e)
{
//Bread and Butter will go here.
}
Finally - the last step will be to calculate the space that is not taken up by the grid (Firebug can be helpful) and tinker with it until your "formula" works out in most browsers:
function onLoad(e)
{
//Gets the height of the Window. ($(window).height())
//Subracts the height of any menus/headers/footers (in this case 275)
//Then divide by our "magic number" which you will need to tinker with
//to determine how the grid looks in different browsers. (in this case 28)
var height = Math.floor(($(window).height()-275)/28);
var grid = $("#YourGrid").data("tGrid");
grid.pageSize = height;
}
Formula :
$(window).height() - [Occupied Space] / [Magic Number]
[Occupied Space] - Total CSS Height of all objects above the Grid.
[Magic Number] - You will have to play with this one and try it out on
different browsers until you get the expected results.
That should automatically adjust your your number of rows based on your window height.The only tricky part is figuring out your own "formula" using the amount of occupied space and then picking a magic number to divide by.
Hope this helps!
精彩评论