DropdownList popup auto height by content

5 posts, 0 answers
  1. Sergey
    Sergey avatar
    3 posts
    Member since:
    Sep 2020

    Posted 18 Sep 2020 Link to this post

    Are there any variants to set popup height by content ? As I see, for that, we can use popupSettings.height for that, but in this case I have to calculate height manually.
  2. Nikolay
    Admin
    Nikolay avatar
    104 posts

    Posted 18 Sep 2020 Link to this post

    Hello,

    By setting popupSettings.height to 'auto', the browser will calculate it for you. Here is an example - https://stackblitz.com/edit/react-xa5jqs?file=app/main.jsx.

    Regards,
    Nikolay
    Progress Telerik

    Five days of Blazor, Angular, React, and Xamarin experts live-coding on twitch.tv/CodeItLive, special prizes, and more, for FREE?! Register now for DevReach 2.0(20).

  3. Sergey
    Sergey avatar
    3 posts
    Member since:
    Sep 2020

    Posted 18 Sep 2020 in reply to Nikolay Link to this post


    Still isn't what I'm looking for - I need something like maxHeight

    I'm trying to build filtering and when It contains many elements,-  It should show scroll, otherwise should work like height auto.

    Maybe smth like this
    popupSettings.height = items.length > 5  ? '100' : 'auto' ?
    Would It work properly 
  4. Sergey
    Sergey avatar
    3 posts
    Member since:
    Sep 2020

    Posted 18 Sep 2020 in reply to Sergey Link to this post

    No, this approach doesn't work.
  5. Stefan
    Admin
    Stefan avatar
    3039 posts

    Posted 22 Sep 2020 Link to this post

    Hello, Sergey,

    Thank you for the clarification.

    The height property actually sets max-height CSS rules instead of height:

    This means, that setting it will show scrolling when there are many items and automatically remove it when there are less items.

    Regards,
    Stefan
    Progress Telerik

    Five days of Blazor, Angular, React, and Xamarin experts live-coding on twitch.tv/CodeItLive, special prizes, and more, for FREE?! Register now for DevReach 2.0(20).

Back to Top