jQWidgets Forums

jQuery UI Widgets Forums Layouts Docking Dynamically changing height of docked window

This topic contains 3 replies, has 2 voices, and was last updated by  Todor 5 years, 6 months ago.

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author

  • sjkcwatson
    Participant

    I have a docking with 3 windows stacked vertically on top of each other. Each window has a grid control in it. Can I dynamically set the height of the docked window to be the height of the grid + some space after the grid has been populated?

    <div id=”docking”>
    <div>
    <div id=”window1″>
    window w/ grid control here
    </div>
    <div id=”window2″
    another window with another grid control here
    </div>
    </div>
    </div>

    the page loads, but the height of the grid controls is configured on load and I’d like the windows to adjust height. I can get the height
    var sectionsHeight = $(‘#jpxgridSiteSections’).jqxGrid(‘height’);
    sectionsHeight = sectionsHeight + 200;

    but cannot figure out the right place to adjust the height of the window so it displays the entire grid.

    Thanks!


    Todor
    Participant

    Hello sjkcwatson,

    Please review the following example whether it fits your needs.

    Let us know if you need further assistance.

    Best Regards,
    Todor

    jQWidgets Team
    https://www.jqwidgets.com


    sjkcwatson
    Participant

    Sort of – you’ve got the grid in the window. What I want to do is change the window size based on the grid – in your example the window height is set to 500. My grid has nested rows so when expanding they overlap the window. My goal with the docking windows was to collapse the various sections so they can open the section they want to work on. It might be easier to just handle with javascript to show/hide the div.


    Todor
    Participant

    Hello sjkcwatson,

    The jqxWindow has an initial height of 500px, but in grid’s callback function ready we take the grid’s height and set the window’s height:

    ready: function() {
          var gridHeight = $('#jqxgrid').jqxGrid('height');
          $('#jqxwindow').jqxWindow({
            height: gridHeight + 200
          })
     },

    I think that is what you want to achieve.

    Best Regards,
    Todor

    jQWidgets Team
    https://www.jqwidgets.com

Viewing 4 posts - 1 through 4 (of 4 total)

You must be logged in to reply to this topic.