Topic: mdb-select drop down list length
Arkadiusz Idzikowski staff answered 6 years ago
itay pro answered 6 years ago
Damian Gemza staff commented 6 years ago
I don't understand your question. How you can change length of dropdown list in Material Select? Simply adding new items to this.optionsSelect array. About notifications: Please subscribe this ticket to watch, and the notifications should arrive to your mailbox. Best Regards, Damianitay pro commented 6 years ago
I am automatically subscribed to ticket I open yet no emails arrive. The list has many options, let say 20. My question is that currently only 4-5 items are shown in the open list, yet I want the user to see more items, let say 10. How can I do it ?Damian Gemza staff commented 6 years ago
Dear mdb2, When mdb-select has more than 4 items, his dropdown got a scrollbar to scroll down the whole list, and there's every item which you're having in your items array. Do you see that scrollbar? I'm attaching a screenshot of my actual behavior: https://imgur.com/a/RcqyzTB Best Regards, Damianitay pro commented 6 years ago
I know there is a scrollbar. I want the use to see more items, without using itallantra pro commented 6 years ago
Hey Damian, We were also wondering the same thing as mdb2: How can we display more than the default 4-5 items in the dropdown, when the user has opened the list. We have lots of areas in our app where the dropdown list has > 100 options and we would like to show more than 5 options at once in the dropdown: How can we change the number of options that are shown at a time in the dropdown list? If this were regular HTML we could do this: and that would show 10 items in the list at any time... how can we accomplish this in MDB? ThanksDamian Gemza staff commented 6 years ago
Dear allantra, mdb2 For now, there's no possibility to change the number of items visible at one time in Select dropdown. But I'll add your feature request to our nice-to-have list, and we'll try to implement it in future. Best Regards, DamianDamian Gemza staff answered 6 years ago
<div class="row"> <div class="col-md-6 mx-auto my-5"> <mdb-select #select [options]="optionsSelect"placeholder="Choose your option"></mdb-select> <label>Example label</label> </div> <div class="col-md-3 my-5"> <button class="btn btn-primary waves-light"mdbWavesEffect (click)="click()">Click me</button> </div> </div>
@ViewChild('select') select: SelectComponent; optionsSelect:Array<any>; ngOnInit() { this.optionsSelect= [ { value: '1', label: 'Option 1' }, { value: '2', label: 'Option 2' }, { value: '3', label: 'Option 3' }, { value: '4', label: 'Option 4' }, { value: '5', label: 'Option 5' }, { value: '6', label: 'Option 6' }, { value: '7', label: 'Option 7' }, { value: '8', label: 'Option 8' }, ]; } click() { console.log(this.select.options.length); }
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Resolved
- ForumUser: Pro
- Premium support: No
- Technology: MDB Angular
- MDB Version: -
- Device: -
- Browser: -
- OS: -
- Provided sample code: No
- Provided link: No