# Multi-select

**URL:** <https://jsonforms.discourse.group/t/multi-select/207>\
**Category:** General\
**Created:** [March 26, 2020, 6:51am UTC](https://jsonforms.discourse.group/t/multi-select/207 "2020-03-26T06:51:27Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![discobot](https://yyz2.discourse-cdn.com/free1/user_avatar/jsonforms.discourse.group/discobot/32/3_2.png) [@discobot](https://jsonforms.discourse.group/u/discobot)\
**Post date:** [March 26, 2020, 6:51am UTC](https://jsonforms.discourse.group/t/multi-select/207/1 "2020-03-26T06:51:27Z")

</div>

How to add multi select dropdown

_[[original thread](https://spectrum.chat/jsonforms/general/multiselect~346b7a7f-acbc-4322-82f9-a931c49f4d70) by Naushad Rahman]_

---

<div class="post-metadata">

**Author:** ![sdirix](https://yyz2.discourse-cdn.com/free1/user_avatar/jsonforms.discourse.group/sdirix/32/1073_2.png) [@sdirix](https://jsonforms.discourse.group/u/sdirix)\
**Post date:** [March 26, 2020, 7:52am UTC](https://jsonforms.discourse.group/t/multi-select/207/2 "2020-03-26T07:52:43Z")

</div>

Hi. Thanks for your interest in JSON Forms!

We don’t provide a multi-select dropdown out of the box but you can implement this on your own using a custom renderer. There are many approaches to this. For example on the schema side you could use an array of strings like this:

```auto
type: 'array',
uniqueItems: true,
maxItems: 3,
minItems: 3,
items: {
  enum: ['Enum1', 'Enum2', 'Enum3', 'Enum4', 'Enum5']
}

```

Now register your own renderer for this element. Within the renderer you could use [Material Ui’s `Select` which supports multi-selection](https://material-ui.com/components/selects/#multiple-select). See [this tutorial](https://jsonforms.io/docs/custom-renderers) on how to implement and register an own renderer.

---

<div class="post-metadata">

**Author:** ![discobot](https://yyz2.discourse-cdn.com/free1/user_avatar/jsonforms.discourse.group/discobot/32/3_2.png) [@discobot](https://jsonforms.discourse.group/u/discobot)\
**Post date:** [October 8, 2020, 4:07pm UTC](https://jsonforms.discourse.group/t/multi-select/207/3 "2020-10-08T16:07:02Z")

</div>

_[Ashwininfant]_

Hi,  
I have tried the given snippet in Angular with Angular-Material. It doesn’t works well. Can you please provide any samples for rendering multi-select dropdown using **angular-material**.

---

<div class="post-metadata">

**Author:** ![sdirix](https://yyz2.discourse-cdn.com/free1/user_avatar/jsonforms.discourse.group/sdirix/32/1073_2.png) [@sdirix](https://jsonforms.discourse.group/u/sdirix)\
**Post date:** [October 9, 2020, 6:47am UTC](https://jsonforms.discourse.group/t/multi-select/207/4 "2020-10-09T06:47:42Z")

</div>

Hi @ashwininfant(ashwininfant), at the moment we don’t provide a multi-select dropdown for any renderer set. The schema posted above was a suggestion on how I would model the JSON Schema side for such a control. So you’ll need to implement a custom renderer for this. If you do so and would like to contribute we’ll definitely take a look.