inputtext (LzInputText)

inputtext (LzInputText)
Prev	Text	Next

Name

inputtext (LzInputText) — The basic input-text element.

Synopsis

LZX: inputtext
JavaScript: LzInputText
Type: Class
Access: public
Topic: LFC.Text
Declared in: WEB-INF/lps/lfc/views/LzInputText.lzs

Description

This tag creates an area of the canvas that the user can use to edit text. It is equivalent to the HTML <input type="text">, <input type="password">, and textarea tags.

See the documentation for the text tag for a description of the width and height attributes, and of scrolling.

Single-line input text

With the multiline and password attributes set to false (the default), this tag is similar to the HTML <input type="text"> tag. In this use, long lines of text are clipped according to the width attribute.

Example 18. Simple inputtext

<canvas height="20">
   <inputtext width="150">This text is editable.</inputtext>
 </canvas>

Multi-line input text

With the multiline attribute set to true, this tag is similar to the HTML <textarea> tag. In this use, text is wrapped to the length of the width attribute, and the user can press Enter to create multiple lines of input.

Example 19. Simple inputtext

<canvas height="20">
   <inputtext width="150" multiline="true">This text is editable.</inputtext>
 </canvas>

Passwords

With password set to true, this tag is similar to the HTML <input type="password"> tag. Input characters are displayed as the asterisk ('*') character.

Example 20. Password inputtext

<canvas height="20">
   <inputtext width="100" password="true">password.</inputtext>
 </canvas>

Optimizing `inputtext`

A large inputtext view will respond to character input slowly. In many cases, it will not be able to keep up with reasonable typing speed, even on a fast machine.

If an instance of inputtext will not be resized at runtime, and the compiler can determine its size at compile time, the compiler can substitute a inputtext view that is optimized to accept text at that size for the generic resizable inputtext view. This optimized inputtext view can keep up with typing speed even at large sizes or on a slow computer.

A program can request an optimized inputtext by setting the resizable attribute to false, and supplying recognizable width and height dimension attributes. A recognizable dimension attribute is an attribute that is defined as a numeric literal, such as width="100", or that is defined as a simple $once expression that adds or subtracts a numeric literal to the width or height attribute of the view's parent, its parent's parent, or so on. This final optimization allows the optimization to apply to inputtext tags within a class definition, as in the second example below.

Example 21. Optimized inputtext

 <canvas height="20">
   <inputtext resizable="false" width="150" height="20">
     This text is editable.
   </inputtext>
 </canvas>

Example 22. Component with optimized inputtext

 <canvas height="20">
   <class name="mytext" width="150" height="20" bgcolor="gray">
     <attribute name="text" type="text"/>
     <inputtext resizable="false" text="${parent.text}" bgcolor="white"
       x="1" y="1"
       width="$once{parent.width-2}" height="$once{parent.height-2}"/>
   </class>
   <mytext>This text is editable.</mytext>
 </canvas>

The compiler can also infer the values of the width and height attributes if they are not supplied. If supplied, the value of the font must be a constant string in order for the text field to be optimized. If supplied, the value of the fontsize must be a constant in order to for the text field to be optimized. Generally these can be omitted and the inputtext will inherit the parent's font size and style by default.

Superclass Chain

node (LzNode) » view (LzView) » text (LzText) » inputtext (LzInputText)

Known Subclasses

Details

Properties (1)

focusable: <attribute name="focusable" />

public var focusable = true;

Methods (6)

getText(): <method name="getText" />

public function getText();
inputtextevent(): <method name="inputtextevent" args="eventname, value" />

public function inputtextevent(eventname, value);
setEnabled(): <method name="setEnabled" args="enabled" />

public function setEnabled(enabled : Boolean);

Sets whether user can modify input text field
setHTML(): <method name="setHTML" args="htmlp" />

public function setHTML(htmlp);

Set the html flag on this text view
setText(): <method name="setText" args="t" />

public function setText(t : String);

setText sets the text of the field to display
updateData(): <method name="updateData" />

protected function updateData();

Retrieves the contents of the text field for use by a datapath. See LzDatapath.updateData for more on this.

Events (3)

onenabled: <attribute name="onenabled" />

public event onenabled;
onselect: <attribute name="onselect" />

public event onselect;
ontext: <attribute name="ontext" />

public event ontext;

whenever the text in the field changes.

LZX Synopsis

</class>

JavaScript Synopsis

public LzInputText extends LzText {

public var focusable = true;

prototype public function getText ();

prototype public function inputtextevent (eventname, value);

prototype public event onenabled ;

prototype public event onselect ;

prototype public event ontext ;

prototype public function setEnabled (enabled : Boolean);

prototype public function setHTML (htmlp);

prototype public function setText (t : String);

prototype protected function updateData ();

}

Copyright © 2002-2007 Laszlo Systems, Inc. All Rights Reserved. Unauthorized use, duplication or distribution is strictly prohibited. This is the proprietary information of Laszlo Systems, Inc. Use is subject to license terms.