We have a Grid with editable: "popup" and custom sizing. Now when a vertical scrollbar is necessary, the "Update" and "Cancel" buttons are not visible because they are scrolled to the bottom (see attached screenshot).
I would like to always show the buttons and only scroll the content. What's the best way to achieve this behavior? Thank you.
5 Answers, 1 is accepted
Implementing the behavior would require including additional CSS that would customize the appearance of the popup editor. This way the container holding the update and cancel buttons can be configured to have fixed position and would not be scrolled. The dojo below outlines the approach:
Regards,
Viktor Tachev
Progress Telerik
Rank 1
Hi Viktor
Thank you for your reply.
In your dojo however - I unfortunately don't see any buttons at all. I am using IE 11, which is the targeted browser for our application. Could you please re-check the code for IE 11? Thank you very much.
Best regards,
Michael
The reason behind this is that position: fixed in IE works differently than in other browsers. Thus, in order to position the buttons outside the scroll area you can use custom JavaScript. Inside the Grid edit event you can calculate the position of the popup editor and set the position of the buttons accordingly.
Regards,
Viktor Tachev
Progress Telerik
Rank 1
Hi Viktor
Thanks for your answer. Unfortunately it's not really working in IE. The Buttons are missing before a scroll and on move of the editor window they stay in place.
We found a working solution with jQuery:
http://dojo.telerik.com/UWoGUDUy/2
Indeed in such scenarios where IE behaves differently than other browsers it can be easier to use JavaScript to position elements on the page. I am glad that you have the functionality working as expected. Thank you for sharing your solution with the community.
Regards,
Viktor Tachev
Progress Telerik