# Controlled Mode

By default, the Signature is in an uncontrolled state.

The Signature provides options for:

* [Controlling its value](https://www.telerik.com/kendo-vue-ui-develop/components/inputs/signature/controlled#controlling-the-value)
* [Controlling its popup state](https://www.telerik.com/kendo-vue-ui-develop/components/inputs/signature/controlled#controlling-the-popup-state)

## Controlling the Value

The value of the Signature is a string containing an image encoded as a [Data URL](https://developer.mozilla.org/en-US/docs/Web/HTTP/Basics_of_HTTP/Data_URLs).

To manage the value of the Signature:

1. Use its [`value`](https://www.telerik.com/kendo-vue-ui-develop/components/inputs/api/signatureprops#value) property.
2. Handle the [`onChange`](https://www.telerik.com/kendo-vue-ui-develop/components/inputs/api/signatureprops#onchange) event.
3. Pass the new value through the props.

[Demo Source](https://demos.telerik.com/kendo-vue-ui/inputs/signature/controlled/value/source.txt)

### Export Resolution

The Signature allows you to control the resolution of the exported image using the [`exportScale`](https://www.telerik.com/kendo-vue-ui-develop/components/inputs/api/signatureprops#exportscale) property. When set to 1, the exported image will match the element size on screen. We recommend using the default value of 2 or higher to improve the quality on high-resolution screens and print.

The following example demonstrates how to set the export scale.

[Demo Source](https://demos.telerik.com/kendo-vue-ui/inputs/signature/controlled/export-scale/source.txt)

### Import Scaling

The Signature scales any images provided as a value to the dimensions of the component. Use images with the same aspect ratio and resolution to avoid distortion.

## Controlling the Popup State

To manage the popup and set the open state of the Signature, use its [`open`](https://www.telerik.com/kendo-vue-ui-develop/components/inputs/api/signatureprops#open) property.

The following example demonstrates how to control the state of the Signature upon display.

[Demo Source](https://demos.telerik.com/kendo-vue-ui/inputs/signature/controlled/popup/source.txt)

## Suggested Links

* [API Reference of the Signature](https://www.telerik.com/kendo-vue-ui-develop/components/inputs/api/signatureprops)