Display % sign for number inside

[ruturajpatki]

Hello,

First, I'm just in love with this jQuery plugin... so easy to implement and it does what it says. However, it only shows the number inside knob. In my case, just a number makes no sense, I need to suffix some unit to it... like %. Is there is any "data-___" setting available for this? Or is there any other way to achieve this?

Waiting for your reply...

Cheers,

Ruturaaj.

[duncanmapes]

Throw a background image into the field via CSS is the simplest solution

On Oct 7, 2013, at 12:05 AM, "Ruturaj V. Patki" <notifications@github.commailto:notifications@github.com> wrote:

Hello,

First, I'm just in love with this jQuery plugin... so easy to implement and it does what it says. However, it only shows the number inside knob. In my case, just a number makes no sense, I need to suffix some unit to it... like %. Is there is any "data-___" setting available for this? Or is there any other way to achieve this?

Waiting for your reply...

Cheers,

Ruturaaj.

—
Reply to this email directly or view it on GitHubhttps://github.com//issues/124.

[culik]

Is there any other option to display text or other element( etc.) inside the knob?

[cor-vo]

CSS content property?
http://www.w3schools.com/cssref/pr_gen_content.asp

[pdeva]

+1 for this issue.
Displaying a % sign is really needed for something like this

[aterrien]

I added this feature on release/1.3.x branch. Not with CSS content property :(

[pdeva]

The current implementation puts the '%' sign on the bottom left corner, instead of next to the number. Which frankly looks very weird.

[aterrien]

It should be centered. Can you tell me if you defined some CSS on your page which would impact the '%' span ? Thank you

[Endorphin75]

Same for me, %-sign on bottom left...I couldn't locate any defined CSS that impacts the generated code.
Edit: obviously CSS-affected, because it works fine on a different page (%-sign is centered below input value) - it seems only an inherited style "text-align: center" centers it correctly though.

[greglbd]

@aterrien I implemented an alternative method for adding a unit to the display input.

greglbd@1ff456b

http://app.livebreathedigital.net/jQuery-Knob/

[winwaed]

Another approach is to amend the draw() callback as per:

http://stackoverflow.com/questions/18955708/how-to-display-units-with-jquery-knob

Unfortunately this then messes up the value plotting if the page is reloaded. This can be fixed by inserting a regex to filter all non-numeric characters from the value. This is also good error checking. I'll submit it as a change.