Menu
So I have a text input
<input type="text" value="3" class="field left"> Here is my CSS for it
background:url("images/number-bg.png") no-repeat scroll 0 0 transparent; border:0 none; color:#FFFFFF; height:17px; margin:0 13px 0 0; text-align:center; width:17px; Is there a setting or a trick to this, I was thinking of doing a label instead but how about the styling. How do I convert them and is there a better way or is that the only way?
859
The readonly attribute is a boolean attribute. When present, it specifies that an input field or textarea is read-only. A read-only field cannot be modified (however, a user can tab to it, highlight it, and copy the text from it).
Navigate to the Security tab and click Manage Security. Check the box that says, “Set a password to restrict editing of security settings.” Enter a password. Set restrictions, including whether to allow printing and which changes you wish to allow.
Solutions with the CSS pointer-events property The second way of making the input text non-editable is using the CSS pointer-events property set to "none", which will stop the pointer-events.
You can either use the readonly or the disabled attribute. Note that when disabled, the input's value will not be submitted when submitting the form. Also It's important to remind that even using readonly attribute, you should never trust user input which includes form submissions.
<input type="text" value="3" class="field left" readonly> No styling necessary.
See <input> on MDN https://developer.mozilla.org/en/docs/Web/HTML/Element/input#Attributes
142
You can add the attribute readonly to the input:
<input type="text" value="3" class="field left" readonly="readonly"> More info: http://www.w3schools.com/tags/att_input_readonly.asp
32
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
