11

With the ever increasing base lightning components Salesforce is putting out, I'm always trying to move to the latest and greatest in hopes that through time, it will be supported better than legacy components (such as the ui namespace).

I have now having a tough time wrapping my head around when to use lightning:combobox and when to use lightning:select. Both of these components seem to overlap quite a bit, especially when talking about a simple picklist.

Can someone please provide an outline on the pro's and con's of each, and what scenarios each would be best fitted for?

Thanks!

2 Answers 2

12

Apparently, the difference is that one is used in the standard UI, and the other is not. If you want your components to look like the Lightning Experience, use lightning:combobox, but if you want something a little more compact, use lightning:select instead. The pro of lightning:combobox is that it is used in the standard UI (at least of Winter '18), while lightning:select is apparently not. In addition, it has an options attribute to allow dynamically setting values in just one line of markup.

The pro of lightning:select is that it it is smaller. As for a con, it requires option values to be generated, which may be either hard-coded or aura:iteration elements. Either way, it requires significantly more markup to render the picklist.

4
  • I thought to put this as an answer in context of SLDS combobox but lightning:combobox is not giving this functionality, we can't type in that combobox
    – Himanshu
    Commented Nov 14, 2017 at 5:50
  • @Himanshu Oh, that's curious. I presumed it would be editable.
    – sfdcfox
    Commented Nov 14, 2017 at 6:00
  • @Himanshu Did some more research on this. What do you think?
    – sfdcfox
    Commented Nov 14, 2017 at 6:10
  • 1
    sadly it is not editable and it seems like issue with readonly attribute. 1. document says that This value defaults to false but it render as readonly="true" in html. 2. readonly attribute is mentioned as parameters but it is not, it doesn't throw compilation error but i see following runtime error ""readonly" must either be a public property". 3. reason of #2 is combobox.js refers readonly: 'true' as hard coded value (i.sstatic.net/w7G8X.png)
    – Himanshu
    Commented Nov 14, 2017 at 6:30
0

Combobox has a tick icon against the selected item.

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .