FileExplorer Width Adjustment

2 posts, 0 answers
  1. Jeff
    Jeff avatar
    1 posts
    Member since:
    Mar 2013

    Posted 16 Mar 2013 Link to this post

    I have a FileExplorer component I have placed inside a JQuery Collapsible Accordion (Width to Content and Auto Height).  When the component renders the sliding of the splitter produces odd width setting on the details grid on the right.  The following is the behavior I have identified.

    1) The component appears to render and size properly to the fixed width and height I specify when the page initially loads. 
    2) When the splitter is slide the details grid reduces in size from around 400 px to about 3 px. 

    The results are similar to the screen shown in this thread:

    I am using JQuery UI 1.10.1 components

    What I have tried to resolve it
    1) Played with the width settings (percentage and px)
    2) Played with writing javascript to force the width of the details grid - don't really like this solution.

    Jeff Swisher
  2. Vessy
    Vessy avatar
    1350 posts

    Posted 20 Mar 2013 Link to this post

    Hi Jeff,

    I have just answered your support ticket on the subject, but for convenience I will paste my answer here as well:

    I managed to reproduce the described issue and most probably it is connected to a known issue with the Splitter (which is a child control for the FileExplorer).

    Basically, when the Splitter has a parent, which is not visible initially, it is not able to calculate its size properly and its
    repaint() function should be called additionally, once it gets visible. This is why my advice is to attach a handler to the click event of the header of the FileExplorer, where to repaint the Splitter.

    For your convenience I am attaching a very simplified page, including only a FileExplore inside an accordion, so you could examine the descried approach on your side.

    Additionally, I will suggest you to use
    Sys.Application.add_load() instead of jQuery's $(document).ready(), beacuse it does not ensure that the client-side object of the server controls are loaded when the code of the $(document).ready() is executed.

    Kind Regards,
    the Telerik team
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
  3. DevCraft R3 2016 release webinar banner
Back to Top