How to allow step in disabled input number - html

I want to have a disabled input number, but I want to be allowed to use the arrows to round it. How can I do it?
<input name="deroga" type="number" class="form-control" step=".01" value="127.05" disabled>
Thank you

<input name="deroga" type="number" class="form-control" step=".01" value="127.05" onkeydown="return false" >

Related

How to Change Value of input field

I want to change the value of this input field. Can someone help please??
<input _ngcontent-c1="" class="margininput ng-untouched ng-pristine ng-invalid" id="empcode" name="EmpCode" ngmodel="" placeholder="EmpCode" required="" type="text" ng-reflect-required="" ng-reflect-name="EmpCode" ng-reflect-model="">
change the input type to whatever you want to change.
example:
<input type="number" placeolder="" name="">
<input type="text" placeolder="" name="">
<input type="password" placeolder="" name="">

html5 input datetime-local: optional time is possible?

I have this input field
<input type="datetime-local" required>
I would like the date part to be always required, but not the time part...
I tried with pattern, like
pattern="[0-9]{4}-[0-9]{2}-[0-9]{2}.*"
but it doesn't seem to work...
any idea...
Edit:
I explain better here
<form name="test" method="POST" action="/">
<input type="datetime-local" name="event_date_start" id="event_date_start"
min="2011-06-07T00:00"
max="2099-06-14T00:00" required><br>
<input type="submit"/>
What I want is to use datetime, but time must be optional.
With the above example, submit is not allowed until you insert 00 in the time field..
I want to leave that optional...
No need for pattern just use the attributes min, max and value:
<input type="datetime-local"
value="2018-06-12T19:30"
min="2018-06-07T00:00"
max="2018-06-14T00:00" required>
If you want an inputfield with date only use:
<input type="date" required>
For time is optional:
<input type="date" required> <input type="time">

How to make the input type="number" to not accept number with leading zeros?

This is my current code for the input field. How can I make it display a message saying that the number I've entered should not start with zero? thanks
<input type="number" min="10" max="1000" class="form-control" name="payment"
placeholder="enter payment" style="text-align:center" autofocus required/>
<br/>
For instance, typing 020 should not be accepted. Only numbers between 10 to 1000.
This should work:
<input type="text" class="form-control" name="payment"
placeholder="enter payment" style="text-align:center" autofocus required
pattern="[1-9]\d*" title="A number with no starting zeros"/>
https://jsfiddle.net/spL2par2/
try this using HTML's pattern attribute
<input type="number" class="form-control" name="payment"
placeholder="enter payment" style="text-align:center" pattern="[1-9]\d*" autofocus required/>
<br/>

How can I validate my input only if my field is not disabled

How can I validate my input only if my field is not disabled. I would like to write something like ng-required="job_name.disabled!="disabled"" but I'm not getting it right.
<input class="form-control" type="text" ng-model="data.job.name" name="job_name"
validate-on="dirty" ng-disabled="true" ng-required="true"
required-message="'Name is required!'" />
How about this
<input class="form-control" type="text" ng-model="data.job.name" name="job_name" validate-on="dirty" ng-disabled="vm.disabled" ng-required="!vm.disabled" required-message="'Name is required!'" />
It means require if not disabled, and keep disable condition on your scope. In the short form
<input ng-disabled="vm.disabled" ng-required="!vm.disabled" />

How to change the default message of the required field in the popover of form-control in bootstrap?

<form class="form-asd" role="form">
<h2 class="form-signin-heading">login</h2><hr />
<label class="control-label" for="username">Username</label>
<input class="form-control" type="email" required="" placeholder="username"data-error="enter username"></input>
<label class="control-label" for="username">password</label>
<input class="form-control" type="password" required=" " placeholder="Password"></input>
<label class="checkbox"></label>
<button class="btn btn-lg btn-primary " type="submit">submit</button>
</form>
how can we change this default message of popover of the require field "Please fill out this field "to "please enter username"
You can use setCustomValidity function when oninvalid event occurs.
Like below:-
<input class="form-control" type="email" required=""
placeholder="username" oninvalid="this.setCustomValidity('Please Enter valid email')">
</input>
Update:-
To clear the message once you start entering use oninput="setCustomValidity('') attribute to clear the message.
<input class="form-control" type="email" required="" placeholder="username"
oninvalid="this.setCustomValidity('Please Enter valid email')"
oninput="setCustomValidity('')"></input>
Combination of Mritunjay and Bartu's answers are full answer to this question. I copying the full example.
<input class="form-control" type="email" required="" placeholder="username"
oninvalid="this.setCustomValidity('Please Enter valid email')"
oninput="setCustomValidity('')"></input>
Here,
this.setCustomValidity('Please Enter valid email')" - Display the custom message on invalidated of the field
oninput="setCustomValidity('')" - Remove the invalidate message on validated filed.
And for all input and select:
$("input[required], select[required]").attr("oninvalid", "this.setCustomValidity('Required!')");
$("input[required], select[required]").attr("oninput", "setCustomValidity('')");
I wanted to change the text of the textarea. This method helped
<form action="/action_page.php" method="post">
<input type="text" required placeholder="username" oninvalid="this.setCustomValidity('Error validate')" oninput="setCustomValidity('')">
<br><br>
<textarea placeholder="Ko’cha, uy, xonadon" name="address" required oninvalid="this.setCustomValidity('Majburiy maydon')" oninput="setCustomValidity('')"></textarea>
<input type="submit" value="Submit">
</form>
$("input[required]").attr("oninvalid", "this.setCustomValidity('Say Somthing!')");
this work if you move to previous or next field by mouse, but by enter key, this is not work !!!