---
agentTools:
  projectIndex: https://opencontent.readme.io/v3.5/llms.txt
---

# Select2

The select2 field is a very powerfull dropdown field.
It get its items from a webapi call using the DNN serviceFramemork.

**schema type** : string, (and array for checkbox list in dropdown)
**options type** : select2

[block:api-header]
{
  "type": "basic",
  "title": "Example 1 - Getting Additional data"
}
[/block]

Additional data are small data lists that you want to use in a template. Typical examples: categories, tags.

[block:code]
{
  "codes": [
    {
      "code": "\"type\": \"select2\",\n \"dataService\": {\n\t\t\t\"action\": \"LookupData\",\n\t\t\t\"data\": {\n\t\t\t\"dataKey\": \"Categories\",\n\t\t\t\"valueField\": \"Id\",\n\t\t\t\"textField\": \"Title\"\n\t\t\t}\n\t}",
      "language": "json"
    }
  ]
}
[/block]

The above example in an option.json file will result in a dropdown of categories as defined in the [Manifest](https://opencontent.readme.io/docs/manifest), with fields Id and Title. When selecting a certain Title, the Id will be saved.
Both Id and Title will become available in the Model of the template, so not just the Id.

[block:api-header]
{
  "type": "basic",
  "title": "Getting items from another OC module"
}
[/block]

[block:callout]
{
  "type": "info",
  "body": "You can mimic (one way) relations in OpenContent simply by defining a select2 field in the option.json file that points to another module."
}
[/block]

[block:code]
{
  "codes": [
    {
      "code": "\"type\": \"select2\",\n \"dataService\": {\n    \"data\": {\n        \"moduleId\": \"123\",\n        \"tabId\": \"456\",\n        \"valuefield\": \"Id\",\n        \"textfield\": \"Name\"\n    },\n    \"action\":\"Lookup\"\n }",
      "language": "json"
    }
  ]
}
[/block]

The above example in an option.json file will result in a dropdown of named items from module 123 (of Tab 456). When selecting a certain Name, the Id will be saved.
The whole object of the selected item will become available in the Model of the template, so not just the Id.

[block:api-header]
{
  "type": "basic",
  "title": "Example 3 - Custom API call"
}
[/block]

You can also create your own API call in your own module

[block:code]
{
  "codes": [
    {
      "code": "\"type\": \"select2\",\n \"dataService\": {\n \t\t\"data\" : {},\n    \"module\" : \"YourFriendlyModuleName\",\n    \"controller\":\"MyModuleAPI\",\n    \"action\":\"Lookup\"\n }",
      "language": "json"
    }
  ]
}
[/block]

To get the data, this field does an ajax post with the dnn serviceframework.

module = dnn module with a web api route defined
controller = webapi controller name
action = method on the web api controller
data : data passed as parameters to the web api controller

[block:callout]
{
  "type": "info",
  "body": "Here a web api controller example (look at Lookup method)\nhttps://github.com/sachatrauwaen/OpenContent/blob/master/Components/OpenContentAPIController.cs"
}
[/block]