How to change the q-select pop over position to bottom not cover?

  • Is there any way to change the q-select popover items to bottom. Just like the setting the q-pop over self and anchor origin? Thanks.

  • I don’t know of one. Looking at the Material Design spec, there is also an “exposed” select type, which Quasar doesn’t yet offer. Might be worth a suggestion? 😄



  • In v0.14.9 the select popover position was set to the bottom… I want to use that kind of display but in the latest version it was changed to cover…

  • Actually, I got thinking about this some more. I was wrong above. It’s sort of a kludge, but it works. 🙂


  • @rstoenescu - If you’d like, I think this is something I could add to the select for v1.0. An “expose” prop? Or just adding the vertical prop to the select and carrying it through to the popover component. I feel the “expose” prop mirrors the Material spec better.

    What do you think? 🙂


  • @s-molinari Wow!! Thanks for providing me a fiddle… Thats what I’ve been looking for 🙂

  • @vince

    It’s something you can do in the future too. Put a “ref” on the component you want to look into and possibly manipulate, then create a method to console.log that ref with this.$refs. You can then drill down into the component and look for ways to manipulate it internally. You’ll also need to find a way to make the changes at the right time too. Fortunately, the select component has the @focus event.

    It’s not the best way to do things, but sometimes you can get some things done that are necessary.


  • If your object is component based, you can also use this.$el to get to the top-level element within your component.

Log in to reply