1

I'm using Jquery knob (http://anthonyterrien.com/knob/) and it works great but rather than have a dimentionless number displayed in the middle I would like to display units with it ei % or F etc ... How can I do this?

CWright
  • 2,068
  • 2
  • 16
  • 20

2 Answers2

6
$("input.Measure").knob({
        min: 1
        max: 10
        stopper: true,
        readOnly: false,//if true This will Set the Knob readonly cannot click
        draw: function () {
             $(this.i).val(this.cv + '%') //Puts a percent after values
        },
        release: function (value) {
      //Do something as you release the mouse
    }
});
Nolan Sunico
  • 86
  • 1
  • 5
  • I have used this for a readonly knob - appears to work on initial load, but the graphical indicator is not drawn when the page is reloaded. – winwaed Jan 29 '14 at 21:08
  • See http://stackoverflow.com/questions/21443055/overriding-units-on-a-jquery-knob-does-not-redraw-correctly-on-page-reload/21461423#21461423 for a solution to the various redraw problems that the above code has. – winwaed Jan 30 '14 at 16:03
2

As Ben explains on Adding Percentages to jquery knob input value, on the recent versions (>1.2.7) you can use the format hook:

$(".dial").knob({
  'format' : function (value) {
     return value + '%';
  }
});
Community
  • 1
  • 1
Arian Acosta
  • 6,491
  • 1
  • 35
  • 32