# Input Dialog

#### lib.inputDialog <a href="#libinputdialog" id="libinputdialog"></a>

```lua
lib.inputDialog(heading, rows, options)
```

* heading: `string`
* rows: `string[]` or `table` (`array`)
  * type: `'input'` or `'number'` or `'checkbox'` or `'select'` or `'slider'` or `'color'` or `'multi-select'` or `'date'` or `'date-range'` or `'time'` or `'textarea'`
* options?: `table`(`object`)
  * allowCancel: `boolean`
    * If true the user will not be able to cancel and close the input dialog until submitted.

Available properties per field type:

* input
  * label: `string`
  * description?: `string`
  * placeholder?: `string`
  * icon?: `string`
  * required? `boolean`
  * disabled?: `boolean`
  * default?: `string`
  * password?: `boolean`
  * min?: `number`
  * max?: `number`
* number
  * label: `string`
  * description?: `string`
  * placeholder?: `string`
  * icon?: `string`
  * required? `boolean`
  * disabled?: `boolean`
  * default?: `number`
  * min?: `number`
  * max?: `number`
* checkbox
  * label: `string`
  * checked?: `boolean`
  * disabled?: `boolean`
  * required?: `boolean`
* select and multi-select
  * label: `string`
  * options: `table`(`array`)
    * value: `string`
    * label?: `string`
  * description?: `string`
  * placeholder?: `string`
  * icon?: `string`
  * required? `boolean`
  * disabled?: `boolean`
  * default?: `string`
    * value of the default option.
  * clearable?: `boolean`
* slider
  * label: `string`
  * placeholder?: `string`
  * icon?: `string`
  * required? `boolean`
  * disabled?: `boolean`
  * default?: `number`
  * min?: `number`
  * max?: `number`
  * step?: `number`
* color
  * label: `string`
  * description?: `string`
  * placeholder?: `string`
  * icon?: `string`
  * required? `boolean`
  * disabled?: `boolean`
  * default?: `string`
  * format?: `'hex'` | `'hexa'` | `'rgb'` | `'rgba'` | `'hsl'` | `'hsla'`;
* date
  * label: `string`
  * description?: `string`
  * icon?: `string`
  * required? `boolean`
  * disabled?: `boolean`
  * default?: `string` or `true`
    * True defaults to current date
  * format?: `string`
    * Date format to display in the field
  * clearable?: `boolean`
* date-range
  * label: `string`
  * description?: `string`
  * icon?: `string`
  * required? `boolean`
  * disabled?: `boolean`
  * default?: `[string, string]`
  * format?: `string`
    * Date format to display in the field
  * clearable?: `boolean`
* time
  * label: `string`
  * description?: `string`
  * icon?: `string`
  * required? `boolean`
  * disabled?: `boolean`
  * default?: `string`
  * format?: `'12'` or `'24'`
  * clearable?: `boolean`
* textarea
  * label: `string`
  * description?: `string`
  * placeholder?: `string`
  * icon?: `string`
  * required? `boolean`
  * disabled?: `boolean`
  * default?: `number`
  * min?: `number`
    * Minimum amount of rows the text area will take.
  * max?: `number`
    * Maxmimum amount of rows the text area will take, when exceeded goes into overflow.
  * autosize?: `boolean`
    * If true text area will grow with content until max rows are reached.

The callback data is promise based meaning that the thread will not continue executing until the user either sends the data or exits the popup.

The data returned will be a table (array), indexes represent the rows sent to the dialog, so if we want data from the first field that would be index `1` (`0`), if we want data from the third field, that would be index `3` (`2`), etc...

#### lib.closeInputDialog <a href="#libcloseinputdialog" id="libcloseinputdialog"></a>

Force closes the active input dialog and sets its return data as `nil`

```lua
lib.closeInputDialog()
```

### Usage Example <a href="#usage-example" id="usage-example"></a>

#### Basic <a href="#basic" id="basic"></a>

```lua
local input = lib.inputDialog('Basic dialog', {'First row', 'Second row'})

if not input then return end
print(input, input[1], input[2])
```

<div align="left" data-full-width="false"><figure><img src="https://i.imgur.com/KnZ0sEW.png" alt=""><figcaption></figcaption></figure></div>

#### Advanced <a href="#advanced" id="advanced"></a>

{% code overflow="wrap" %}

```lua
local input = lib.inputDialog('Dialog title', {
  {type = 'input', label = 'Text input', description = 'Some input description', required = true, min = 4, max = 16},
  {type = 'number', label = 'Number input', description = 'Some number description', icon = 'hashtag'},
  {type = 'checkbox', label = 'Simple checkbox'},
  {type = 'color', label = 'Colour input', default = '#eb4034'},
  {type = 'date', label = 'Date input', icon = {'far', 'calendar'}, default = true, format = "DD/MM/YYYY"}
})

print(json.encode(input))

-- Getting r, g and b values from colour picker
local r, g, b = string.match(input[4], "rgb%((%d+), (%d+), (%d+)%)")

-- Transforming unit date return to be used with Lua's os library
local date = input[5] / 1000
```

{% endcode %}

<div align="left"><figure><img src="https://i.imgur.com/v44YEkC.png" alt=""><figcaption></figcaption></figure></div>


---

# Agent Instructions: Querying This Documentation

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

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://max-workx.gitbook.io/maxworkx-private-fivem-docs/library/overextended/client-sided/ui/input-dialog.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
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.
