Questions tagged [input-field]

The `` tag specifies an input element. `input` elements are used within a `form` element to declare input controls that allow users to input data. An input control can vary depending on its `type` attribute.

The <input> tag specifies an input field where the user can enter data.

<input> elements are used within a <form> element to declare input controls that allow users to input data.

An input field can vary in many ways, depending on the type attribute


Browser Support

CHROME IE FF SAFARI http://www.w3schools.com/images/compatible_safari.gif OPERA


Tips and Notes

Note: The <input> element is empty, it contains attributes only.

Tip: Use the <label> element to define labels for <input> elements.


Type Attribute Values

button

Defines a clickable button (mostly used with a JavaScript to activate a script)


checkbox

Defines a checkbox


color

Defines a color picker

HTML5


date

Defines a date control (year, month and day (no time))

HTML5


datetime-local

Defines a date and time control (year, month, day, hour, minute, second, and fraction of a second (no time zone)

HTML5


email

Defines a field for an e-mail address

HTML5


file

Defines a file-select field and a Browse... button (for file uploads)


hidden

Defines a hidden input field


image

Defines an image as the submit button


month

Defines a month and year control (no time zone)

HTML5


number

Defines a field for entering a number

HTML5


password

Defines a password field (characters are masked)


radio

Defines a radio button


range

Defines a control for entering a number whose exact value is not important (like a slider control)

HTML5


reset

Defines a reset button (resets all form values to default values)


search

Defines a text field for entering a search string

HTML5


submit

Defines a submit button


tel

Defines a field for entering a telephone number

HTML5


text

Default. Defines a single-line text field (default width is 20 characters)


time

Defines a control for entering a time (no time zone)

HTML5


url

Defines a field for entering a URL

HTML5


week

Defines a week and year control (no time zone)

HTML5


Refers From :

  1. http://www.w3schools.com/tags/tag_input.asp
  2. http://www.w3schools.com/tags/att_input_type.asp
465 questions
144
votes
4 answers

React-Native cannot write first letter with noncapital

I have some trouble with react-native. I have an Input component(like textfield) for user to enter his email address, but the thing is that, first letter always comes as capital letter default and it is impossible to make it non-capital. How can I…
Ali Zeynalov
  • 2,867
  • 8
  • 30
  • 54
66
votes
4 answers

What is the correct readonly attribute syntax for input text elements?

As Most, I am familiar with the readonly attribute for text input, But while reading code from other websites (a nasty habit of mine ) I saw more than one implementation for this attribute:
Obmerk Kronen
  • 15,619
  • 16
  • 66
  • 105
46
votes
7 answers

How to display file name for custom styled input file using jquery?

I have styled a file input using CSS: .custom-file-upload { border: 1px solid #ccc; display: inline-block; padding: 6px 12px; cursor: pointer; }
39
votes
10 answers

How to avoid automatic focus on first input field when popping a HTML form as a JQuery dialog?

I have seen similar questions on SO, including this one, which is old. I read and followed links, but it is unclear whether there is a proper solution to this issue today. My bottom issue is that I am using HTML's placeholder="..." on the input…
Jérôme Verstrynge
  • 57,710
  • 92
  • 283
  • 453
38
votes
8 answers

HTML5 input type=number change step behavior

If I use an input field of type="number" with step="100". I don't want odd numbers to be invalid. I just want increase or decrease to be with a value of 1000. If the user enters the value…
mabs
  • 987
  • 1
  • 10
  • 17
34
votes
12 answers

How to force input to only allow Alpha Letters?

using jQuery here, however unable to prevent numbers from being typed into the input field http://codepen.io/leongaban/pen/owbjg Input
Leon Gaban
  • 36,509
  • 115
  • 332
  • 529
28
votes
1 answer

Is there a way to have a masked numeric input field?

I am creating an HTML5 application on an Android and for this specific scenario, we have an input field that is for a credit card's security code and we want to force the input field to be numberic only and masked. I have had no luck searching for…
JakeW
  • 303
  • 1
  • 3
  • 7
27
votes
9 answers

CSS - Removing input field active highlight

Using only html and css, how do I disable the blue (in Firefox) highlight color around an active input field. I've tried using input {outline:none;} but with no success. Thanks for the help! =) ok,ignoring the previous code about outline, I chose…
Kizer Yakuza
  • 747
  • 2
  • 8
  • 13
23
votes
9 answers

How to check if the file input field is empty?

I am having a hard time using $_FILES I want to check if file upload field is empty or not then apply a condition such that if file upload is empty then the script doesn't try uploading the file. How do I enforce this?
Mohamed Hassan
  • 1,579
  • 4
  • 19
  • 35
19
votes
3 answers

Get text from Input field in Unity3D with C#

I'm trying to get a text inside an inputField in Unity3D with C#. I've placed an inputField in my editor, renamed and tagged in: Username_field. My question is: How i can get the text inside the InputField Username_field in a C# script?
Mirko Brombin
  • 1,002
  • 3
  • 12
  • 34
17
votes
5 answers

jQuery dynamic input field focus

I want to add an input field dynamically to my page using the following jQuery: var inputNode = ""; $("div").append(inputNode); and after doing so, I want the…
Kumite
  • 173
  • 1
  • 1
  • 5
16
votes
3 answers

Is there any danger to using input fields outside/without forms in HTML/Javascript pages?

Input fields are usually associated to forms, but I would like to use them in a simple Javascript/HTML page. I don't need the form. I see no issue with my HTML page, but is there any danger or bad practice I am not aware of? I just don't want my…
Jérôme Verstrynge
  • 57,710
  • 92
  • 283
  • 453
15
votes
4 answers

How to get a number value from an input field?

I have some issues with calculating some stuff with JS and getting the right values out of the input fields (number). When I use this code it doesn't show anything. So what is wrong with my JS? Do I need to include a jQuery file?
Bart
  • 717
  • 1
  • 9
  • 28
14
votes
4 answers

How to bind default value of input field to variable?

When clicking a certain button in the UI of my Angular App, a dialog opens where the user can update his/her personal information. For the sake of simplicity I restrict the code in the following to his/her username. That is, I assume the user can…
Tommy
  • 699
  • 4
  • 11
  • 26
12
votes
3 answers

input number max attribute resizes field

When adding a max value to an input number field in Chrome, it will re-size the field according to width of highest value. It seems that I cannot control the re-sizing behavior.
yesman82
  • 431
  • 1
  • 3
  • 12
1
2 3
30 31