3

In my components I want to use the Dueling-picklist from the LIGHTNING DESIGN SYSTEM. On the website there is no example code but just this BETA note.

enter image description here

I need examples for the markup and how to add functionality to it. Did anyone implement this already?

2
  • 2
    "This is a prototype" means "this is likely to change before release, so you should not attempt to use it." That said, it's entirely possible to write your own...
    – sfdcfox
    Jun 30, 2017 at 12:14
  • I will NEVER write my own listbox again. Never ;-)! Jun 30, 2017 at 12:45

2 Answers 2

3

I have implemented this design twice - my second effort is much more performant and functional.

https://github.com/rapsacnz/DualSelect

Here's what it looks like:

DualSelect gif

You can:

  • Drag from source to destination
  • Drag from destination to source
  • Dragging will attempt to put the item where you dropped it.
  • Drag to reorder in any list
  • Shift select several items in source or destination, then use the arrow buttons to move to either source or destination
  • Highlight an item and use the up / down buttons to move up and down.
4
  • 1
    Nice. Great work!
    – Eric
    Sep 15, 2017 at 2:52
  • Glad you like it. My next one is a lightning notes framework driven entirely by custom metadata - you define the notes you want to appear in metadata and configure where you want the notes to appear in lightning layout. It's nice because you can make different notes show up in different places all driven by the same metadata. Sep 15, 2017 at 2:57
  • 1
    Great work. I hope the native Dueling Listbox Salesforce will release in Winter'18 as part of Lightning Base components will be as elegant as this one. Sep 15, 2017 at 8:59
  • btw, here's the lwc version: github.com/rapsacnz/OrderedListGroup Mar 22, 2021 at 22:28
3

I've found this example of another developer's implementation of a dueling picklist:

https://www.linkedin.com/pulse/dueling-picklists-lightning-component-yogaraj-kv-1/

and the code for the example is at:

https://github.com/yogarajkv/DuelingPicklist_Lookup-Lightning/tree/master/aura

You must log in to answer this question.

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