PricingBlog

Select/Dropdown component height from SparkOne

  • fe_rojas-1356625387513184358

    FeRojas

    9 months ago

    Maybe there is a simple way to this but... Anyone knows how to make the height of the options fix to a specific height and use a dropdown to navigate options? I have a select connected to database that display sometimes more than 20 options.
    1
  • max.kayr-1356634913352192080

    Max

    9 months ago

    I am not 100% sure what you want to achieve... Do you want to have a scrollable area in a select?
  • fe_rojas-1356636706656354364

    FeRojas

    9 months ago

    Yes 👍 . When a select menu has a lot of choices, we need to show a set number, like "X" options, and let users scroll within the content area to see more. Otherwise, the select area becomes too big for the screen, and users have to scroll the whole page to find what they want. (Or Im missing something?)
  • fe_rojas-1356637264175960064

    FeRojas

    9 months ago

    PS More than "X" number options, a select content area height.
  • fe_rojas-1356641507297333529

    FeRojas

    9 months ago

    *Correction: When there are too many options, user cannot scroll the page also because the dropdown is active. So is not possible to choose an option that is not shown on page (at least for me behave like that)
  • max.kayr-1356648009437286524

    Max

    9 months ago

    The select has a sc-select-scroll-area part. When you use that, you can scroll within the select content 😊
  • fe_rojas-1356697667664609521

    FeRojas

    9 months ago

    Ah! I think I need to study a little more how spark kit works. In the meantime, one question: The sc-select-scroll-area is part the of spark core, I was using spark one template. Can I add the sc-select-scroll-area to so-select-content, or need to build the select component using just spark core components?
    1356697667396304936-image.png
  • fe_rojas-1356700453752279230

    FeRojas

    9 months ago

    It seem I just needed to wrap the so-select-item with the sc-select-scroll area. Now it works. Thanks @Max !
    1356700453546623147-image.png
    💪1
  • Tod-1356700455392252034

    Tod

    9 months ago

    Great energy @FeRojas! Your continuous contribution to the toddle Community just made you advance to Community Level 5!