Class: Input

stb/ui/input~ Input

new Input(configopt)

Base input field implementation. Has two types: text and password. Password - replace real text with '*', but real text presents in the own property 'value'.

Parameters:
Name Type Attributes Default Description
config Object <optional>
 {}

init parameters (all inherited from the parent)

Properties
Name Type Attributes Default Description
value string <optional>
 'text'

input text value
placeholder string <optional>
 'password'

placeholder text value
Source:
Example
var Input = require('stb/ui/input'),
    input = new Input({
        placeholder: 'input password'
        events: {
            change: function ( event ) {
                debug.log(event.value);
            }
        }
    });

Extends

  • Component

Members

$caret :Element

Caret element, which shows current cursor position.

Type:
  • Element
Source:

$placeholder :Element

Hint element with placeholder text.

Type:
  • Element
Source:

Current active method to move focus according to pressed keys. Can be redefined to provide custom navigation.

Type:
  • function
Source:

type :number

Input type, now available only text and password. Different logic with different types. TYPE_TEXT - normal input. TYPE_PASSWORD - hidden input, all chars replaced with '*', but real value is located in 'this.value'.

Type:
  • number
Source:

value :string

Text value of input.

Type:
  • string
Source:

Methods

addChar(char, indexopt)

Add given char to given position. Also moving caret in every action. Do nothing if position is < 0, or if index more or equals to length add char to the end.

Parameters:
Name Type Attributes Default Description
char string

symbol to add
index number <optional>
 this.value.length

given position
Source:
Fires:
  • module:stb/ui/input~Input#event:input

init(config)

Init or re-init of the component inner structures and HTML.

Parameters:
Name Type Description
config Object

init parameters (subset of constructor config params)
Source:

Default method to move focus according to pressed keys.

Parameters:
Name Type Description
event Event

generated event source of movement
Source:

removeChar(indexopt)

Remove char from given position. Do nothing if index is out of the range (0, length).

Parameters:
Name Type Attributes Default Description
index number <optional>
 this.$caret.index - 1

index given position
Source:
Fires:
  • module:stb/ui/input~Input#event:input

setCaretPosition(index)

Move caret to the given position. Do nothing if index is out of the range (0, this.value.length).

Parameters:
Name Type Description
index number

given position
Source:

setValue(value)

Setting new text value of the input field.

Parameters:
Name Type Description
value string

given string value
Source: