I have 2 questions:
Question 1: I have a spinner function and I have one slight problem with it. If a user types in 00000009 or 00021 in the spinner for example, if the user clicks away from the spinner, it will still display 00000009 or 00021 in the spinner. What I want is that if something like this happens, then what I want is that when the user clicks away, I want the spinner to display it as 9 or 21 rather than 00000009 or 00021. I don't know how to do this though. Does anyone know how to overcome this:
Question 2: If I used backspace to remove a number from a spinner and that is left with a blank spinner, what needs to be done so that if I click away from the spinner, the last number in the spinner re-appears in the spinner?
My main spinner function:
function Spinner(elem,min, max){
this.elem = elem;
this.elem.value = min;
this.min = min;
this.max = max;
this.timer;
this.speed = 150; //milliseconds between scroll values
var selfO = this;
this.elem.onkeyup = function(){
var regex = /^[0-9]*$/;
if(!regex.test(selfO.elem.value)){
selfO.elem.value = selfO.elem.value.substring(0,selfO.elem.value.length-1);
return;
}
selfO.validateValue();
}
this.validateValue = function(){
if(Number(selfO.elem.value) > selfO.max) {selfO.elem.value = selfO.max;}
if(Number(selfO.elem.value) < selfO.min) {selfO.elem.value = selfO.min;}
}
this.stopSpinning = function(){
clearTimeout(selfO.timer);
}
this.spinValue = function(dir){
selfO.elem.value = Number(selfO.elem.value) + dir;
selfO.validateValue();
selfO.timer = setTimeout(function(){selfO.spinValue(dir);},selfO.speed);
}
};
window.onload=function(){
//create the Spinner objects
var SpinnerHours = new Spinner(document.getElementById('txtHours'),0,23);
}