I'm trying to make the minimum allowed input amount to be 1.00 and not to allow 0.99 or anything less than 1.00
<input type="text" onkeyup="switchSlider(this.value, 1)" value="25.00" class="master-amount" name="master-amount" id="master-amount">
-
1Yes, and? w3.org/TR/html-markup/input.number.htmlMarc B– Marc B2014-08-11 22:15:22 +00:00Commented Aug 11, 2014 at 22:15
Add a comment
|
2 Answers
User HTML min Attribute
<input type="number" min="1.00" onkeyup="switchSlider(this.value, 1)" value="25.00" class="master-amount" name="master-amount" id="master-amount">
Here is an example for you
http://www.w3schools.com/tags/tryit.asp?filename=tryhtml5_input_max_min
Comments
Update:
You can test the value on keyup as per code below and force 1 as the min value.
<input type="number" onkeyup="switchSlider(this)" value="25.00" class="master-amount" name="master-amount" id="master-amount">
switchSlider = function (e){
if (!e.value || e.value < 1) e.value=1;
}
You can do this right in your markup using the min max and step attributes, note you need to use type="number"
<input type="number" min="0" max="100" step="5">
In your code:
<input min="1" type="number" onkeyup="switchSlider(this.value, 1)" value="25.00" class="master-amount" name="master-amount" id="master-amount">
6 Comments
acctman
i'm still able to input .01 even though it starts out as 1
MartinWebb
OK. Can you explain what you are trying do do: Do you want 1.00 or 1. Do you want only int vals; 1,2,3 or 1.2, 2, 3.5 if the user enters less than 1 say .99 what do you want to happen?
acctman
I want it to be 1.00 as the min. do .99 or 0.99 would not be allowed. US Dollar amounts with $1.00 being the min.
acctman
Ideal would be if user inputs anything below 1.00 the box auto clears with an error. I've seen this done before but can't remember where
MartinWebb
I have added a fiddle see my update to my answer, I have a feeling your not in control of the function switchSlider? Anyway, I have made my own that does a simple truth test on the value, and sets it to 1. Depending on browser you can use form validation (HTML5) and in the java-script fire it to show the error, or rather than set the value to one, clear it and add a css class what have you, to show an error occurred.
|