I'm making a form. And on one input
tag is an OnClick
event handler, which is opening a popup, where you can choose some stuff, and then it autofills the input
tag.
That input tag is also readonly
, so only right data will be entered.
This is the code of the input
tag:
<input type="text" name="formAfterRederict" id="formAfterRederict" size="50" required readonly="readonly" OnClick="choose_le_page();" />
But the required
attribute isn't working in Chrome. But the field is required.
Does anybody know how I can make it work?
The readonly attribute is a boolean attribute. When present, it specifies that an input field is read-only. A read-only input field cannot be modified (however, a user can tab to it, highlight it, and copy the text from it).
Click Review > Restrict Editing. Under Editing restrictions, check Allow only this type of editing in the document, and make sure the list says No changes (Read only).
A readonly element is just not editable, but gets sent when the according form submits. A disabled element isn't editable and isn't sent on submit.
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.
I had same requirement as yours and I figured out an easy way to do this. If you want a "readonly" field to be "required" also (which is not supported by basic HTML), and you feel too lazy to add custom validation, then just make the field read only using jQuery this way:
IMPROVED
form the suggestions in comments
<input type="text" class="readonly" autocomplete="off" required /> <script> $(".readonly").on('keydown paste focus mousedown', function(e){ if(e.keyCode != 9) // ignore tab e.preventDefault(); }); </script>
Credits: @Ed Bayiates, @Anton Shchyrov, @appel, @Edhrendal, @Peter Lenjo
ORIGINAL
<input type="text" class="readonly" required /> <script> $(".readonly").keydown(function(e){ e.preventDefault(); }); </script>
readonly
fields cannot have the required
attribute, as it's generally assumed that they will already hold some value.
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