LogoLogo
FeaturesHelp & ResourcesShowcasePricingLogin
Squirrel Addon Documentation
Squirrel Addon Documentation
  • README
  • Table of contents
  • Building an addon
    • Communication
    • Property Panel
      • Property Panel Elements
        • Accordion
        • Checkbox
        • Color Input
        • Conditional Logic
        • Dropdown
        • Font
        • Horizontal Line
        • Input Box
        • Radio Button
        • Series
        • Sub Accordion
        • Text Label
    • Publishing an addon
      • Restricting private addons
      • The review process
      • Add-on submission
        • Icon guidelines
        • Image guidelines
  • introduction
    • Joining the Developer Program
  • past-events
    • Building your first add-on
  • squirrel-helper-library
    • Dot notation
    • Angular
      • Classes
        • SquirrelCanvas
        • SquirrelColor
        • SquirrelMessage
        • SquirrelPosition
        • SquirrelSize
      • Events
        • onInitState
        • onPropertyChange
        • onPropertyChangesComplete
        • onSetCanvas
        • onSetPosition
        • onSetRuntimeMode
        • onSetSize
      • Getting Started
        • Building your first addon
        • Debugging
        • Sending and Receiving Data
        • The JSON files
      • Methods
        • getBindingDimension
        • getCanvas
        • getCopyOfState
        • getGenericProperty
        • getPosition
        • getRuntimeMode
        • getSize
        • initWithSquirrel
        • parseColor
        • sendToSquirrel
        • setPosition
        • setSize
        • shadeColor
        • tintColor
    • JavaScript
      • Classes
        • SquirrelCanvas
        • SquirrelColor
        • SquirrelMessage
        • SquirrelPosition
        • SquirrelSize
      • Events
        • onInitState
        • onPropertyChange
        • onPropertyChangesComplete
        • onSetCanvas
        • onSetPosition
        • onSetRuntimeMode
        • onSetSize
      • Getting Started
        • Building your first add-on
        • Debugging
        • Sending and Receiving Data
        • The JSON files
      • Methods
        • getBindingDimension
        • getCanvas
        • getCopyOfState
        • getGenericProperty
        • getPosition
        • getRuntimeMode
        • getSize
        • initWithSquirrel
        • parseColor
        • sendToSquirrel
        • setPosition
        • setSize
        • shadeColor
        • tintColor
    • React
      • Coming Soon
Powered by GitBook
LogoLogo

Explore

  • Home
  • Features
  • Pricing
  • Download Squirrel

Help

  • Learn
  • Community
  • Support
  • FAQ's

Updates

  • Blog
  • Events
  • Release Notes

Company

  • Contact Us
  • Privacy Policy
  • Terms of Use

Copyright © 2019 - 2024 InfoSol Ltd. All rights reserved.

On this page

Was this helpful?

  1. Building an addon
  2. Property Panel
  3. Property Panel Elements

Input Box

PreviousHorizontal LineNextRadio Button

Last updated 3 years ago

Was this helpful?

{
    "type": "InputBox",
    "properties": {
        "labelName": "Button Text:",
        "shortPropertyName": "",
        "disabled": false,
        "type": "Text",
        "min": 0,
        "max": 0,
        "step": 1,
        "allowBinding": true,
        "allowCounter": false,
        "allowManualEntry": true,
        "spellcheck": false,
        "placeholder": "",
        "textArea": false,
        "textAreaRows": 5,
        "liveUpdate": false,
        "bindingPropertyName": "buttonText"
    }
}

The property name needs to match the string specified in bindingPropertyName property. The value will be the default value to show in the input box.

{
    "buttonText": "Get Data"
}

This element has a large number of configurable properties. If a property has a default value then you do not need to provide it in the propertyPanel.json file unless you want to specify a value different to the default.

Configurable properties

bindingPropertyName

string - the property name from defaultState with which to connect to.

mandatory

labelName

string - the text to display above the input box as a title

mandatory

shortPropertyName

string - the text to display inside and on the right of the text input box.

defaults to an empty string

disabled

bool - if set to true this will disable the input box for interaction

defaults to false

type

string ( Text | Integer | Decimal | Currency | Percent | Password | URL )

defaults to Text

min

number - the minimum value allowed to be entered

For Integer, Decimal, Currency and Percent types

defaults to 0

max

number - the maximum value allowed to be entered

For Integer, Decimal, Currency and Percent types

defaults to 0

step

number - the size of increments a number increases in when using allowCounter

For Integer, Decimal, Currency and Percent types

defaults to 0

allowBinding

bool - specifies whether you want the input field to be bindable or not

defaults to true

allowManualEntry

bool - specifies whether you want people to be able to type values into the input box

defaults to true

allowCounter

bool - specifies whether to add up and down stepper arrows to the input box

For Integer, Decimal, Currency and Percent types

defaults to false

spellcheck

bool - specifies whether you want the browser to highlight incorrect spelling in text within the text input box

defaults to true

placeholder

string - what placeholder text to display in the empty input box

defaults to empty string

textArea

bool - specifies whether the input box is a single line text input, or a multi-line text area input

defaults to false

textAreaRows

number - specifies how many rows tall to make the text area input

defaults to 5

liveUpdate

bool - specifies whether you want each key press in the input box to trigger an update in state. Note this will trigger communication to the addon for each key press

defaults to false