• Introduction
  • Getting Started
  • Vue 2 End of Support
  • Vue Wrappers End of Life
  • Native Components
    • Animation
    • Buttons
    • Chartsupdated
    • Conversational UI
    • Data Query
    • Data Tools
    • Date Inputs
    • Date Math
    • Dialogs
    • Drawing
    • Dropdowns
    • Editor
    • Excel Export
    • File Saver
    • Form
    • Gauges
    • Gridupdated
    • Icons
    • Indicators
    • Inputsupdated
    • Labels
    • Layout
    • ListBox
    • ListView
    • Notification
    • PDF Processing
    • Popup
    • Progress Bars
    • Scheduler
    • ScrollView
    • Tooltip
    • TreeList
    • TreeView
    • Upload
  • Wrapper Components
  • Sample Applications
  • Styling & Themes
  • Common Features
  • Project Setup
  • Knowledge Base
  • Changelog
  • FAQ
  • Troubleshooting
Components / Inputs / API / SignatureProps / 
New to Kendo UI for Vue? Start a free 30-day trial

SignatureProps

Represents the props of the Kendo UI for Vue Signature component.

NameTypeDefaultDescription

ariaDescribedBy?

string

Identifies the element(s) which will describe the component, similar to HTML aria-describedby attribute. For example these elements could contain error or hint message.

ariaLabel?

string

The accessible label of the component.

ariaLabelledBy?

string

Identifies the element(s) which will label the component.

backgroundColor?

string

The background color of the signature.

Accepts CSS color names and hex values.

The default value is determined by the theme $kendo-input-bg variable.

color?

string

The stroke color of the signature.

Accepts CSS color names and hex values.

The default value is determined by the theme $kendo-input-text variable.

dir?

string

Represents the dir HTML attribute.

disabled?

boolean

Determines whether the Signature is in its disabled state.

exportScale?

number

2

The scale factor for the exported image.

The Signature width and height will be multiplied by the scale when converting the signature to an image.

fillMode?

"null" | string

solid

Configures the fillMode of the Signature.

The available options are:

  • solid
  • outline
  • flat
  • null—Does not set a fillMode className.

hideLine?

boolean

false

A flag indicating whether the dotted line should be displayed in the background.

id?

string

Sets the id of the Signature DOM element.

inputStyle?

object

Represents the input element style HTML attribute.

maximizable?

boolean

true

A flag indicating if the signature can be maximized.

modelValue?

string

Specifies the v-model.

name?

string

Specifies the name of the Signature input.

onBlur?

(event: SignatureBlurEvent) => void

The event handler that will be fired when Signature is blurred.

onChange?

(event: SignatureChangeEvent) => void

Determines the event handler that will be fired when the user edits the value.

onClose?

(event: SignatureCloseEvent) => void

The event handler that will be fired when Signature popup is closed.

onFocus?

(event: SignatureFocusEvent) => void

The event handler that will be fired when Signature is focused.

onOpen?

(event: SignatureOpenEvent) => void

The event handler that will be fired when Signature popup is open.

open?

boolean

Sets the open and close state of the Signature.

popupScale?

number

3

The scale factor for the popup.

The Signature width and height will be multiplied by the scale when showing the popup.

readOnly?

boolean

Determines whether the Signature is in its read-only state.

required?

boolean

The required state of the component.

rounded?

"null" | string

medium

Configures the roundness of the Signature.

The available options are:

  • small
  • medium
  • large
  • null—Does not set a rounded className.

size?

"null" | string

medium

Configures the size of the Signature.

The available options are:

  • small
  • medium
  • large
  • null—Does not set a size className.

smooth?

boolean

false

A flag indicating whether to smooth out signature lines.

strokeWidth?

number

1

The stroke width of the signature.

tabIndex?

number

Sets the tabIndex property of the Signature.

valid?

boolean

Overrides the validity state of the component. If valid is set, the required property will be ignored.

validationMessage?

string

The validation message of the component.

validityStyles?

boolean

The validity styles. Defaults to 'true'.

value?

string

Specifies the value of the Signature.

The value is an image encoded as a Data URL.

In this article

Not finding the help you need?

Contact Support