CODEWITHSUNDEEP
javascriptjquerynanjquery-knob
Rusty Shackleford
Rusty Shackleford

Reputation: 213

NaN Jquery knob

I am trying to remove the NaN showing on my jquery knob. I have tried a few thing such as setting a timeout and adjust the count down timer. How can I fix my knob so it no longer shows NaN when first called?

example http://codepen.io/missile20706/pen/jAaYjx

$.fn.timer = function( userdefinedoptions ){ 
    var $this = $(this), opt, count = 0; 


    opt = $.extend( { 
        // Config 
        'timer' : 30, // 300 second default
        'width' : 100 ,
        'height' : 100 ,
        'fgColor' : "blue" ,
        'bgColor' : "white" 
        }, userdefinedoptions 
    ); 


    $this.knob({ 
        'min':0, 
        'max': opt.timer, 
        'readOnly': true, 
        'width': opt.width, 
        'height': opt.height, 
        'fgColor': opt.fgColor, 
        'bgColor': opt.bgColor,                 
        'displayInput' : true, 
        'dynamicDraw': false, 
        'ticks': 0, 
        'thickness': 0.3 
    }); 


    setInterval(function(){ 
        newVal = ++count; 
        $this.val(newVal).trigger('change'); 
    }, 1000); 
};

$('.example').timer();

Upvotes: 0

Views: 314

Answers (2)

Hector Barbossa
Hector Barbossa

Reputation: 5528

The initial value of input is not set which is causing this issue. You can either add a value attribute in your html (as suggested by the posted answer), or change your js function to set it. Like 

$.fn.timer = function( userdefinedoptions ){ 
    var $this = $(this), opt, count = 0; 
    $(this).val(0);
    opt = $.extend( { ...

Upvotes: 0

user6470655
user6470655

Reputation:

Just set the initial value of your input to "0"

<input class="example" value="0">

Upvotes: 3

Related Questions