I happened to write this:
<input type="hdnStatus" name="hidden" value="1" />
Instead of:
<input type="hidden" name="hdnStatus" value="1" />
I was surprised that the first line generated a text box with no correct type
specified.
If first line generates text box, then is the below line of any use:
<input type="text" name="tbox" value="" />
It definitely is. What I mean is that rendering engines should be smart enough to
reject any incorrect input. Such things always create confusion and problems.
How did that happen?
Is this browser's fault or something else?
Or it is something wrongly correct?
From the HTML 4.01 spec:
Attribute definitions
type = text|password|checkbox|radio|submit|reset|file|hidden|image|button [CI]
This attribute specifies the type of control to create. The default value for this attribute is "text".
So it appears that your browser falls back to the default value for type if it is invalid. This seems like sensible behaviour to me.
All browsers (that I am aware of) will degrade to an input with type="text" if the type attribute is not valid.
Some people have even advocated using this to your advantage to get ready for HTML 5, which has more types.
For example you could do:
<input type="date" ...
which would still be a regular text box, but the fact that the type is distinct, you can use javascript/css to make it more usable by adding a datepicker or something automatically.
And then, once HTML 5 actually does come around, the browser itself would be able to render a custom input widget that is specific for dates.
Another usage of this feature is type="number", which is also a valid type in HTML 5. Using javascript to monitor fields with type number would allow for immediate feedback to the user if the data they entered was not actually a number.
Related
Does it make any difference if i don´t include this attribute?
For example, on this <input>:
<input class="trn" id="searchInput" placeholder="Search..." />
Text is the default as #Xufox pointed out. Even if you try to validate against a W3C validator, and you type the input without the type, it will mark it as valid. You can try to validate your doc here:
https://validator.w3.org/check
However, as personal preference, and for readability purposes, I would always specify the type.
Regards
It's best practice to put type="whatever" because that will tell the HTML DOM what kind of input you want. Otherwise how does it know you want a radio button, checkbox, input field?
I need to add "0" as an allowable value which is outside the max/min range:
<input type="number" min="70" max="94" value="0" required>
I'm trying to avoid using JavaScript if possible.
It appears that the solution for input of this type is to use the pattern attribute instead of min/max.
https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/pattern
I don't have the exact regex off the top off my head for your case, but it should be pretty easy. (and I presume yours is only an example anyhow.)
I have a similar issue, where I have number inputs for 0-100 but also need to allow a few values with special meaning like 996-999.
I read about value attributes documentation here. It does not clearly mention why is it required for the input tag.
According to the documentation
"value attribute specifies the value of an element" what exactly does it mean by "value"?
Is it a just for humans to know what exactly a checkbox is for?
Or does the value has anything to do with the backend database?
Is the value attribute just for front end purpose only?
I know this question has been asked previously, but not all aspects of what a "value attribute" is were discussed. So I would like to raise the question again, and have another discussion about it.
Is it a just for humans to know what exactly a checkbox is for?Does value attribute is just for frontend purpose only?
The value property sets or returns the value of the value attribute of a checkbox/radiobutton.
For checkboxes and radiobuttons, the contents of the value property do not appear in
the user interface. The value property only has meaning when
submitting a form. If a checkbox/radiobuttons is in checked state when the form is
submitted, the name of the checkbox/radiobuttons is sent with along with the value
of the value property (if the checkbox/radiobuttons is not checked, no information
is sent).
For example, when you are using <input type="button" name="foo" value="Click"/>, this will assign name 'Click' to your button. Same goes for text field: <input name="subject" type="text" value="Default text" /> will show you a text field with 'Defaul text' in it.
Value is where the actual value of the field is stored. Try changing it with jQuery or even with firebug and you will see that the submitted value will be changed!
Given <input type="checkbox" name="foo" value="bar"> the submitted data for the checkbox will be foo=bar if the form it is inside is submitted and the checkbox is successful (the main additional criteria for which is that it is checked). The server side form handler can then use that information.
The value is not exposed to the user of the browser (unless they use a developer tool of some kind). That is the job of the <label> element.
I've had a quick look and couldn't find what I needed. I expect it to be something simple. I have an input text box whose type is set to a number with range between 1 to 20. This works perfectly.
However, the user can just type in abc or 21, which defeats the point. How can I set it so that the text box doesn't allow that?
maybe you can use "pattern"
<input type="text" pattern="[0-9]+" />
input type="number" and "range" not supported in Firefox.
You might want to solve using javascript, or, if it is only a matter of 20 numbers (ie 1-20), why not use a drop down?
such as:
<select>
<option>1</option>
</option>
etc...
HTML5 has a 'number' type input element. It looks like this:
<input type="number" name="quantity" min="1" max="5">
You can see it in action here: http://www.w3schools.com/html/tryit.asp?filename=tryhtml5_input_type_number
However, not every browser supports this, so you you may need to validate the input given by the user. This page will tell you which browsers support this feature:
http://www.w3schools.com/html/html5_form_input_types.asp
I have an XHTML 1.0 Strict document with an input field with autocomplete='off'. The w3c validator tells me that in strict documents you may not use autocomplete. So is there an alternative without changing the document type?
No. XHTML 1.0 provides no means to tell browsers not to help users fill in form fields.
You can use javascript. Write a little function that clears all of the input fields in a form by settings there value to an empty string. On page load, call the function, but call it in a setTimeout of about a second or so. If a value has been automatically entered into a field by the browser, it will be wiped by the javascript. The only problem with this is that the autocomplete value may be temporarily visible in the field before it is replaced.
You can solve this issue simply by using jquery
//Try this one:
$(document).ready(function(){
$("input.autocompleteOff").attr("autocomplete","off");
});
//For all textbox -
$(document).ready(function(){$("input").attr("autocomplete","off");});
//HTML
<input type="text" name="field" id="field" class="autocompleteOff" />
How about putting a hidden and fake password field like
<input type="password" name="stupid_autofill" id="stupid_autofill" value="" style="display:none;">
before the real password field. This generally works on the basis of the browser trying to guess the input field before the password field.
The correct solution in this latest version is put on the input
autocomplete = 'false'.