Vue TextBox - Overview

The TextBox is a UI component that enables a user to enter and edit a single line of text.

View Demo

The following code adds a simple TextBox with a placeholder to your page.

<div id="textBoxContainer" style="width:300px"></div>

$(function() {
    $("#textBoxContainer").dxTextBox({
        placeholder: "Type a text here..."
    });
});

If an end user should not be able to edit the value in the TextBox, assign true to the readOnly property. In this case, make sure to set the value property too.

$(function() {
    $("#textBoxContainer").dxTextBox({
        value: "The value that should not be edited",
        readOnly: true
    });
});

See Also

• Configure a Widget: Angular | Vue | React | jQuery | AngularJS | Knockout | ASP.NET MVC 5 | ASP.NET Core
• TextBox - Task-Specific Modes
• TextBox - Handle the Value Change Event
• TextBox - Handle the Keyboard Events
• TextBox - Limit the String Length
• TextBox - Specify a Mask for the Input
• TextBox API Reference
• TextArea