> For the complete documentation index, see [llms.txt](https://dev.ubidots.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://dev.ubidots.com/dashboards-and-widgets/custom-ui/input-combo.md).

# Input combo

Displays an input field based on the \`type\` property.

Input combos share the following properties across all types:

<table><thead><tr><th width="141.33333333333331">Attribute</th><th>Description</th><th>Values</th></tr></thead><tbody><tr><td>type</td><td>The input field type</td><td><ul><li><code>text</code></li><li><code>number</code></li><li><code>number.buttons</code></li><li><code>date</code></li><li><code>hour</code></li><li><code>toggle</code></li><li><code>dropdown.list</code></li><li><code>dropdown.checkbox</code></li></ul></td></tr><tr><td>id</td><td>A unique identifier for this field</td><td>Any user-defined string</td></tr><tr><td>label</td><td>The text label shown next to the input</td><td>Any user-defined string</td></tr><tr><td>description</td><td>Small helper text below the label</td><td>Any user-defined string</td></tr><tr><td>placeholder</td><td>The placeholder text shown inside the input field</td><td>Any user-defined string</td></tr><tr><td>shape</td><td>Used to align the label and the input field</td><td><ul><li><code>compactVertical</code></li><li><code>wideVertical</code></li><li><code>wideHorizontal</code></li></ul></td></tr><tr><td>value</td><td>Sets a default value.</td><td>Depends on the input combo type. Check each section.</td></tr></tbody></table>

{% hint style="warning" %}
When you set the `value` property, it overrides `placeholder`. The field shows the default value instead of the placeholder text.
{% endhint %}

### Examples

```xml
<form>
    <paragraph type="h1">Send data form</paragraph>

    <inputcombo
      description="Choose the variable to which you want to send data"
      id="variable_label"
      label="Variable label"
      placeholder="Enter the label of the variable"
      type="text"
      value="default"
    />

    <inputcombo
      description="Set the value that you want to send"
      id="variable_value"
      label="Variable value"
      max="100"
      min="0"
      placeholder="Enter the value that you want to send"
      step="2"
      type="number"
      value="34"
    />

    <inputcombo
      description="Set the date when the measurement was taken"
      id="start_date"
      label="Date"
      placeholder="Set the date"
      type="date"
      value="2024-07-19T17:30"
    />

    <inputcombo
      description="Set the value that you want to send using buttons"
      id="variable_value_button"
      label="Variable value with buttons"
      max="100"
      min="0"
      placeholder="Enter the value that you want to send"
      type="number.buttons"
      value="50"
    />

    <inputcombo
      description="Set the state of the device"
      id="enable_device"
      label="Enable device"
      type="toggle"
      value="true"
    />

    <inputcombo
      description="Set the time when the measurement was taken"
      id="start_hour"
      label="Start Time"
      type="hour"
      value="21:00"
    />

    <inputcombo
      description="Select a common variable from all devices"
      id="variable_from_list"
      label="Select a variable"
      placeholder="Choose an option"
      type="dropdown.list"
      value="temperature"
    >
      <menu>
        <item id="temperature">Temperature</item>
        <item id="humidity">Humidity</item>
        <item id="iluminance">Illuminance</item>
        <item id="magnetic_flux">Magnetic flux</item>
      </menu>
    </inputcombo>

    <inputcombo
      description="Select multiple devices to send data"
      id="devices_from_list"
      label="Select multiple options"
      placeholder="Choose multiple options"
      type="dropdown.checkbox"
      value="dev_1,dev_2"
    >
      <menu>
        <item id="dev_1">Device 1</item>
        <item id="dev_2">Device 2</item>
        <item id="dev_3">Device 3</item>
        <item id="dev_4">Device 4</item>
      </menu>
    </inputcombo>

    <button click="make_request" type="success">Send</button>
  </form>
```


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation by asking a question.

Perform an HTTP GET request on the following URL with the `ask` and `goal` query parameters:

```
GET https://dev.ubidots.com/dashboards-and-widgets/custom-ui/input-combo.md?ask=<question>&goal=<user_goal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is what the user is ultimately trying to achieve, the reason they need the answer. Sharing it helps GitBook give you a better, more relevant answer. A goal is most helpful when it describes the outcome the user wants rather than restating the question. For example, with `ask=how do I create an API token`, a goal like `automate deployments from our CI pipeline` lets GitBook tailor the answer to that use case.

The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.