I can't get jQuery knob to display a value

Question

First, thanks in advance for any advice. I've looked everywhere for a solution and can't find anything. Admittedly, Javascript isn't my strong suit.

I'm using fineuploader to upload files, one-by-one and using jQuery knob to display the upload progress. The knob is for upload progress updates only and shouldn't be interactive. I can style it, set the size completion % of the knob, etc. but I cannot get it to display the upload % in the middle.

Here's my code.

}).on('upload', function(event, id, name) {
    var progressField = $('#' + 'pic' + (id + 1)).parent();
    progressField = progressField.parent();
    var picName = $(progressField).children('label:first').html();
    $(progressField).attr("class", "uploaderBox");
    $(progressField).html('');
    $('.uploaderBox').html('<span class="picName">Uploading ' + picName + '...</span>');
    $(progressField).append('<div id="progressKnob"></div>');
    $("#progressKnob").knob({
                            "displayInput": true,
                            "thickness": .15,
                            "width": 70,
                            "fgColor": "#FF00FF",
                            "inputColor": "#000000"
                            });
}).on('progress', function(extra, id, name, uploadedBytes, totalBytes){
    var currentProgress = Math.round((uploadedBytes / totalBytes) * 100);
    $('#progressKnob')
        .val(currentProgress)
        .trigger('change');
}).on('complete', function(event, id, name, responseJSON){
    $('#progressKnob')
        .val(100)
        .trigger('change');

Answer 1

After many days of tinkering, I solved my own problem. I just thought I'd post it here in case anybody else develops the same problem I did and needs the answer.

First, I have to take credit for my own mistake. I was attempting to use jQuery knob for a purpose other than the one it was intended for. I really only wanted it to display the progress of an upload. I had no intention of using it to input anything so I put it in a standard div. It worked fine in the div for everything other than the numeric upload percentage. I couldn't get it to display a number in the center of the circle.

The problem is that it wasn't intended to be in an div at all. It wouldn't accept an 'input' value because it wasn't an input field. Once I assigned the .knob to an input field everything fell right into line.

For anybody that reads this later and laughs, I'm glad I amused you. For anybody that it helps, well, that's good too.