# Type not JSON serializable

**URL:** <https://community.plotly.com/t/type-not-json-serializable/11525>\
**Category:** Dash Python\
**Created:** [July 5, 2018, 2:55pm UTC](https://community.plotly.com/t/type-not-json-serializable/11525 "2018-07-05T14:55:34Z")\
**Posts on this page:** 7\
**Page:** 1

<div class="post-metadata">

**Author:** ![klnrdknt](https://sea2.discourse-cdn.com/flex024/user_avatar/community.plotly.com/klnrdknt/32/3758_2.png) [@klnrdknt](https://community.plotly.com/u/klnrdknt)\
**Post date:** [July 5, 2018, 2:55pm UTC](https://community.plotly.com/t/type-not-json-serializable/11525/1 "2018-07-05T14:55:34Z")

</div>

I’ve seen this come up before, but so far, no answer seems to be given.

In my case, I want to use ‘type’ Objects as values for a Dropdown menu, which results in the old JSON error. Is there a way to achieve this? Maybe it would be a good addition in general, as passing type can make a lot of calls easier. Of course, I could also use `type. __name__ ` and then have an additional if statement checking for that, but it just occured to me that a general workaround or the allowance of more value types would be nice.

Is there an outlook on this issue or any plans? Even ways to contribute?

---

<div class="post-metadata">

**Author:** ![Peter\_S](https://sea2.discourse-cdn.com/flex024/user_avatar/community.plotly.com/peter_s/32/3432_2.png) [@Peter\_S](https://community.plotly.com/u/Peter_S)\
**Post date:** [July 5, 2018, 4:37pm UTC](https://community.plotly.com/t/type-not-json-serializable/11525/2 "2018-07-05T16:37:01Z")

</div>

Do you mean passing objects that are custom classes into the options list?

If so, have you considered giving your classes a property or method that just returns their relevant contents as a dictionary object? Passing `myObject.d` seems quite clear and clean.

It’s either that, or work out how to pass a customized superclass of jsonEncoder into the dash library, which sounds comparatively cumbersome.

---

<div class="post-metadata">

**Author:** ![klnrdknt](https://sea2.discourse-cdn.com/flex024/user_avatar/community.plotly.com/klnrdknt/32/3758_2.png) [@klnrdknt](https://community.plotly.com/u/klnrdknt)\
**Post date:** [July 5, 2018, 4:44pm UTC](https://community.plotly.com/t/type-not-json-serializable/11525/3 "2018-07-05T16:44:17Z")

</div>

I might be misunderstanding the error, but the issue occured when setting the ‘value’ of a dropdown option to a type object. This would in theory result in the type object being passed as the value of the callback to my evaluating function, where i could then call a classmethod or the constructor of that type, get the classes signature etc…

I managed to make it work passing `type. __name__ ` instead and later evaluating that against `class. __subclasses__ (). __name__ ` and calling a constructor on that subclass.

As in:

```auto
if inputValue is not None:
   for subclass in Class. __subclasses__ ():
      if subclass. __name__ == inputValue:
         sign = [p for p in inspect.signature(subclass. __init__ ).parameters]
```

**EDIT**  
What i would have liked to do:

```auto
if inputValue is not None:
   sign = [p for p in inspect.signature(inputValue. __init__ ).parameters]
```

---

<div class="post-metadata">

**Author:** ![Peter\_S](https://sea2.discourse-cdn.com/flex024/user_avatar/community.plotly.com/peter_s/32/3432_2.png) [@Peter\_S](https://community.plotly.com/u/Peter_S)\
**Post date:** [July 5, 2018, 4:57pm UTC](https://community.plotly.com/t/type-not-json-serializable/11525/4 "2018-07-05T16:57:02Z")

</div>

Sorry, you’ve lost me a little. I can’t quite track how you want your data to be stored and where you want it to go.

Do you have a class containing a list (‘parameters’) of objects that themselves have attributes/ class variables of “label” and “value”, and you want to be able to bulk compose them into a list of dropdown options?

---

<div class="post-metadata">

**Author:** ![klnrdknt](https://sea2.discourse-cdn.com/flex024/user_avatar/community.plotly.com/klnrdknt/32/3758_2.png) [@klnrdknt](https://community.plotly.com/u/klnrdknt)\
**Post date:** [July 5, 2018, 5:53pm UTC](https://community.plotly.com/t/type-not-json-serializable/11525/5 "2018-07-05T17:53:42Z")

</div>

Yeah, there is a dash dropdown component

[https://dash.plot.ly/dash-core-components/dropdown](https://dash.plot.ly/dash-core-components/dropdown)

and mine looks like this:

```auto
dcc.Dropdown(
                options=self._options,
                id='filter_unit_dropdown_{0}_{1}_{2}'.format(self._deviceNumber, self._servoNumber, self._filterIndex),
                className='three columns'
            )
```

with `self._options` being

```auto
self._options = [{'label': 'None', 'value': None}]
        for filter in self._servoController.getFilterOptions():
            self._options.append({'label': filter. __name__ , 'value': filter. __name__ })
```

and `getFilterOptions()` works in the way I previously described:

```auto
def getFilterOptions(self):
        return [filter for filter in Filter. __subclasses__ ()]
```

As for the callback structure

```auto
def _createFieldVisibCallback(self, dropdownID, filterFieldID):
        def callback(inputValue):
            return self._servoController.filterFieldVisibility(filterFieldID, inputValue, self._deviceNumber, self._servoNumber, self._filterIndex)
        return callback

def setCallbacks(self):
        dropdown = 'some_id'.format(self._deviceNumber, self._servoNumber, self._filterIndex)
        frequencyField = 'another_id'.format(self._deviceNumber, self._servoNumber, self._filterIndex)

        dynamically_generated_function = self._createFieldVisibCallback(dropdown, frequencyField)
        self._app.callback(
            Output(frequencyField, 'style'),
            [Input(dropdown, 'value')]
        )(dynamically_generated_function)

```

and lastly the functionality of

`_servoController.filterFieldVisibility(xxx)` is what I described in the post before.

---

<div class="post-metadata">

**Author:** ![Peter\_S](https://sea2.discourse-cdn.com/flex024/user_avatar/community.plotly.com/peter_s/32/3432_2.png) [@Peter\_S](https://community.plotly.com/u/Peter_S)\
**Post date:** [July 5, 2018, 6:12pm UTC](https://community.plotly.com/t/type-not-json-serializable/11525/6 "2018-07-05T18:12:19Z")

</div>

Well, I’m tapped out for useful input then. It sure looks like in all that structure, the difference between

```
item. __name__
and
item.stringProperty_Set_AtInstantiation_or_InDefinition_or_OnConstruction

```

is the least of your worries.

Additionally, passing an object directly into the DCC renderer and having it pick to use a string representation of the object’s class’ name (if i follow what you’re describing) sounds like really non-obvious and potentially troublesome behavior.

---

<div class="post-metadata">

**Author:** ![chriddyp](https://sea2.discourse-cdn.com/flex024/user_avatar/community.plotly.com/chriddyp/32/16855_2.png) [@chriddyp](https://community.plotly.com/u/chriddyp)\
**Post date:** [July 6, 2018, 3:29am UTC](https://community.plotly.com/t/type-not-json-serializable/11525/7 "2018-07-06T03:29:25Z")

</div>

> [@klnrdknt](#):
>
> but the issue occured when setting the ‘value’ of a dropdown option to a type object. This would in theory result in the type object being passed as the value of the callback to my evaluating function, where i could then call a classmethod or the constructor of that type, get the classes signature etc…

Unfortunately this is not going to work. `value` needs to be a string. We don’t enforce this right now but we will in the future. We are passing this `value` over the network to the Dash front-end, which is why we can’t handle arbitrary python objects. The underlying component that we use in the front-end also expects a string.

If you want to keep things dynamic, then use a dictionary that maps strings to your objects:

```auto
values = {
    some_object: 'value-1',
    another_object: 'value-2'
}

dcc.Dropdown(value=values[some_object])

```