Displaying and editing text (HTML)

  • Article

[ This article is for Windows 8.x and Windows Phone 8.x developers writing Windows Runtime apps. If you’re developing for Windows 10, see the latest documentation ]

Here's how to display and edit text in a Windows app using JavaScript.

See this feature in action as part of our App features, start to finish series: User interaction: Touch input... and beyond.

Single-line text controls A single-line text input control lets users enter one line of text into your application. It includes a clear button so users can quickly remove the contents they've typed, and a password reveal button if it's a password input control.

A single-line text control.

To create a single-line text control, you use the input element and set its type attribute to one of these values: "email", "number", "password", "tel", "text", or "url".

Multi-line text controls A multi-line text control lets users enter larger amounts of text. It includes a panning indicator, or scrollbar, when the text gets longer than the row height of the box.

A multi-line text control.

There are two kinds of multi-line text boxes.

  • Plain text box supports strings of text where only the characters of the string are encoded and represented in the box. To create a plain text box, you use the textarea element.
  • Rich text box supports strings of text where each character is also associated with stylistic info, such as bold, underline, italics, superscript, and so forth. To create a rich text box, you set the contentEditable property of the elements that you want to edit.

In this section

Topic Description

Quickstart: Display text

Windows apps using JavaScript can use several elements to display text. The primary elements for displaying read-only text include label, div, paragraph, and heading. This quickstart shows you how to use these elements to display text.

Quickstart: Text input and editing

Windows apps using JavaScript can use several elements for entering and editing text, along with a set of attributes and properties for formatting text. The primary text-entry elements are text box, text area, password input box, and rich edit box/rich text box. This quickstart shows you how you can use these elements to display, enter, and edit text.