Need 50% Discount?
Download which is 50% OFF.
{inAds}
MultiTextBoxInput is a jQuery plugin that displays multiple textboxes for single input. It is used for serial number, SSN, IP address, phone number or other values that has multiple parts. It automatically focuses the next textbox as the required characters are entered. It also automatically focuses previous textbox on backspace. This control makes the input more beautiful, easier and readable.
A web server control is also available for the same purpose.
Video Demo:
Features:
- Displays multiple text boxes for single input.
- Can be used for serial number, ssn, phone number or other similar inputs.
- Input can be restricted to numbers.
- Input can be restricted to letters.
- Input can be restricted to apha numeric values.
Width is automatically calculated based on the following parameters:
- The number of characters
- Input type (numeric characters take less space than alphabetic characters)
- Uppercase/lowercase characters (lower case characters take less space than uppercase characters)
- Auto conversion to uppercase or lowercase characters as specified.
- Auto focuses next part/textbox after the required characters are entered.
- Auto focuses previous part/textbox on backspace.
- You can specify the number of textboxes to be displayed along with a separator.
- Hint can also be displayed to the right of textboxes.
- Examples have been provided.
Properties:
- value: The text that is displayed in the textboxes.
- inputCount: It is the number of text boxes to be displayed.
- separator: It is the separator for each part of the input.
- hint: It is a label that is displayed to the right of the text boxes.
- hintCssClass: It is the CSS class for hint.
- inputLengths: It is comma separated lengths for the text boxes.
- cssClasses: It is comma separated CSS classes for the text boxes.
- charCase: It is case of the characters (none/uppercase/lowercase).
- inputType: It is input type of the text boxes (none/alphabetic/numeric/alphanumeric).
- allowDecimalPoint: It indicates whether decimal point should be allowed for numeric input type.
- allowSpaceForAlphabeticType: It indicates whether white space should be allowed for alphabetic and alpha numeric input types.
Methods:
- value(): It gets text of the textboxes.
- vlaue(value): It sets text of the textboxes.
- isEmpty(): It determines whether all text boxes are empty or contain only white spaces.
- isInputComplete(ignoreWhiteSpace): It determines whether values have been entered with the required length in all text boxes.
More Useful Items:
| Compatible Browsers | IE7, IE8, IE9, IE10, IE11, Firefox, Safari, Opera, Chrome |
| Software Version | jQuery |
| Demo URL | |
| High Resolution | |
| Files Included | JavaScript JS, HTML, CSS |
| Video Preview Resolution | 938x672 |