I have a webdatagrid with the WebResizingExtender attached. My default grid size allows 6 records to be visible without scrolling so I set pagesize to 6. Is there an easy way to determine the max amount of visible records after the user resizes the grid using the webResizingExtender? Currently, when the user makes the grid bigger, the grid shows blank space at the bottom as the pagesize is still 6. I would like to do this automatically without having to add a control for the user to set pagesize manually.
Thank you for posting in our community.
My suggestion is to handle the OnClientResize event of the WebResizingExtender control. In the handler, the container and row heights can be retrieved and sent to the code-behind using the __doPostBack function. There, the rows per page can be calculated and set to reflect the new height.
For this to work, however, the rows have to be the same height. To ensure this will be the case the cells' content has to be prevented from being wrapped using CSS.
Since the OnClientResize event emits the size of the element on which it is attached and we need only the rows container's height, the height of every other element that is present in the WebDataGrid has to be considered also. In the attached sample the additional elements are the header and pager rows.
Please test it on your side and let me know how it behaves.
Thanks for working this issue with me. I looked at your code for the resize event of the grid and am seeing some weird stuff. Here's what I did.
1. just testing the __doPostBack function with the basics to see what happens:
when I run it with these settings I can grab the grid resizing handle and actually drag to resize the grid, but when I lift my finger off of the mouse the grid snaps back to its original size.
If I comment out the __doPostBack
I can resize the grid and it stays the new size. So there is something about the __doPostBack that is causing the grid not to resize.
2. I then put in your sample code to see what would happen:and I ran it, I clicked the resize handle, and resized the grid, but when I released the mouse button it was as if the mouse button was still pressed. That is, even with no mouse buttons pressed as I moved the mouse the grid continued to change size just as if I never released the mouse button. Very strange.
3. I had to do an "Imports Newtonsoft.Json" (i'm using vb.net) in my codebehind to use the Json functions, do I have to do anything in the aspx file also?
For testing I just put a msgbox in the codebehind:
I also took out your code in the aspx and just put in the simple postback
then, when I resized the grid, the msgbox did pop up with the message, but as soon as I clicked "ok" the grid snapped back to its original size. Again, if I comment out the msgbox in the codebehind and tried to resize the grid it immediately snapped back to its original size as soon as I took my finger off the mouse button.
So, weird stuff going on. To summarize:
---If I use your code in the aspx the system doesn't seem to recognize when I release the mouse button and keeps resizing the grid when the mouse is moved.
---If I use a simple postback in the aspx then the system recognizes the mouse release, but as soon as it does the grid snaps back to its original size.
---Finally, if I comment out all the code in the "function ReSizeGrid(sender, eventargs) in the aspx then resizing the grid works fine.
In order to run the sample, the external Newtonsoft.Json framework should be referenced.
The behavior - when the mouse button is released but keeps resizing the grid when the mouse is moved - indicates that something went wrong on the client-side. Please check the browser console for any exceptions.
The idea of the post-back on resize is to send information about the new grid size to the server-side, so that the new WebDataGrid`s height and rows per page to be set. I have attached a screencast of how it works.
Additionally, I have converted the sample to Visual Basic and attached it for your reference. Please test it on your side and let me know how it behaves.
Hi Martin, I tried to open your sample so I could try and determine why your sample works and mine doesn't (or to see if your sample also fails in my environment) and the references to the infragistics controls are undefined:
I made sure that the references were there, and they appear to be ok
I noticed that the toolbox did not have a tab for the infragistics controls, as I was going to drag the controls on to the web form so that they would reference my controls and not yours (which were undefined). But I could not get the infragistics tab to populate. I created a new tab and tried to drag the dll files onto the tab but it didn't work. I have no idea why. When I did a "show all" on the toolbox it did have an infragistics 19.2 tab the the controls were all greyed out.I then thought that I would create a new website from scratch and copy your code into my new website, but I couldn't figure out how to create the website with the "default.aspx.designer.vb" file. Can you tell me what options and choices you made in visual studio when creating the sample. When I tried various options, I either got no designer.vb file or I got a whole bunch of additional files associated with the template. I know there are several issues I've outlined here, but I wanted to give you as complete a picture as possible as to what I have tried to do. I guess the issues are:1. the controls in your sample were undefined (probably some sort of version mismatch).2. no infragistics tab in the toolbox, and could not seem to add it.3. could not create a new website with the designer.vb file.
I want to thank you for all your assistance in this.
As you have concluded, the best way is to create a new project and copy the source code to it. Following the steps listed below should allow you to run the sample:
1. Create a new empty ASP.NET project. 2. After initialization right click on the web application from the solution explorer. 3. In the context menu go to Add and then choose Web Form. 4. Name your form. I am naming it default because Visual Studio does this when scaffolding a Web Form project. 5. From the toolbox drag WebScriptManager, WebDataGrid and WebResizingExtender. 6. Copy the content between the html tags from the Default.aspx file in the sample I have sent. 7. Install the NuGet package Newtonsoft.Json. 8. Copy all the content from the Default.aspx.vb file. 9. On the .aspx page switch to Design or Split mode to be prompted to include the ig_res folder. 10. Run the project.
Looking forward to hearing from you.