NumericTextBox Input| UI Control for ASP.NET AJAX, C#, VB.NET

NumericTextBox Input in ASP.NET

Home > How to > Input NumericTextBox

In NumericTextBox Input mode of KT.UI for ASP.NET SDK, uses only can input numeric values, which can be number, currency and percent. With the property customizing support of NumericTextBox Input control, users also can be free to set and define usual attributes of PerInput component by using online demo ASP.NET methods and sample codes, such as, specify the skins of Input application, set empty message and max length flexibly as well as create and customize label, and so on so forth.

In texts below, users can be well informed of the specific types of NumericTextBox Input component within web ASP.NET project, and the comprehensive demo ASP.NET codes on setting increment, data range, and numeric formatting.

Specific Types of ASP.NET NumericTextBox Input Control

KT.UI for ASP.NET AJAX PerInput NumericTextBox library supports three independent numeric types â number, currency and percent that can be selected and adjusted by using Type property. The input number type you choose will decide the format of value in the text box when it does not have focus.

When users set the Type property as "Number", the input value is displayed and formatted as simple number like sample screenshot below:

When users switch the Type property as "currency", the input value will be formatted as currency. See following screenshot image.

When users need to display the input value in percent format, you can set the Type property as "Percent".

Here we give the sample ASP.NET codes on how to switch among these three numeric types.

<kettic:PerNumericTextbox id="PerNumericTextBox1" runat="server"
type="Currency" width="200px" >
            </kettic:PerNumericTextbox>

ASP.NET Codes for Increment setting

Sample image over this paragraph is the screenshot of number increment and decrement setting interface. With the support of KT.UI NumericTextBox Input, users can set ShowSpinButtons property as true within SpinButtons control to adjust the data value of NumericTextBox via the up and down arrows. Users can adjust the numeric values via keyboard and mouse wheel.

By using keyboard: when set the InterceptArrowKeys property as âtrueâ in IncrementSettings, users can specify the data value in NumericTextBox through up and down keys in keyboard.

By using mouse wheel: when set the InterceptMouseWheel property as âtrueâ in IncrementSettings pane, users can change the data value in NumericTextBox by scrolling the mouse wheel.

<kettic:PerNumericTextBox ID="PerNumericTextBox1" runat="server" ShowSpinButtons="true" >
                                <IncrementSettings InterceptArrowKeys="true" InterceptMouseWheel="true" Step="1" />
                            </kettic:PerNumericTextBox>

An explanation here: the parameter "Step" in above sample ASP.NET codes refers to the variation value in each time.

ASP.NET Codes for Setting Data Range

Users can use following demo ASP.NET codes to set and define the data range in the numeric text box by using MaxValue and MinValue attributes.

<kettic:PerNumericTextBox ID="PerNumericTextBox1" runat="server" 
MaxValue="150" MinValue="0" >
                                
                            </kettic:PerNumericTextBox>

Numeric Formatting Setting for ASP.NET AJAX

As we mentioned before, if the input value in the numeric text box does not have focus, the NumberFormat property of numeric type you choose will affect the value format.

See more online sample codes on How to build and set NumericTextBox input using C#.

ASP.NET AJAX UI Controls

ASP.NET AJAX Input UI Control

Overview Getting Started TextBox

NumericTextBox

MaskedTextBox DateInput Input Manager

Client Prpgramming

Input Event

Server Prpgramming

Input Event ASP.NET AJAX ListBox UI Control ASP.NET AJAX ListView UI Control ASP.NET AJAX ToolBar UI Control ASP.NET AJAX TabControl UI Control ASP.NET AJAX Menu UI Control ASP.NET AJAX ToolTip UI Control