design-patterns-controls-MultiLineTextBox.md

MultiLineTextBox

Basics

When to use

Gathering text input is available via multiple controls, choose the one most suited to your needs

• CopyableLabel - multi-line text input with built-in support for infoBalloonContent and an easy way for user to copy value.
• NumericTextBox - restricts input to numbers only and built-in support for validations, infoBalloonContent and placeHolderText
• PasswordBox - text input that uses a * character instead of echoing user input with built-in support for validations, infoBalloonContent and placeHolderText. Use PasswordBox for security sensitive fields.
• TextBox - single-line text input with built-in support for validations, infoBalloonContent and placeHolderText
• MultilineTextBox - multi-line text input with built-in support for validations, infoBalloonContent and placeHolderText

Best practices

Do

• Set the infoBalloonContent to concise, helpful text with a link to learn
• Use placeHolderText for examples of field values
• Use the validations option to help the user input the correct text if a specific format is required
• Use the label option to provide a helpful name for the control.
• When part of a form, provide clear designations for which fields are required vs. optional.

Don't

Developer tips and tricks

• To display HTML in the infoBalloonContent use this code

infoBalloonContent: { htmlTemplate:"Sample label
infoBalloonContent should explain concepts and
can include a link to learn more.Learn more about infoBalloon", viewModel: {}, }

Interactive control and sample source code

Go to the playground site to use the latest control and get source code for your project. Learn more about playground.

• MultiLineTextBox in the interactive controls playground

Related info

• Azure design guidance