javascript - Jquery UI Progressbar filling reduced progress -
$.get('jobs', { }, function (responsetext) { rt = json.parse(responsetext); console.log(rt); (i = 0; < rt.length; i++) { $("#jobs").append("<tr><td><div id='progressbar"+i+"' class='progressbar'></div></td></tr>"); pval = (rt[i][2] / rt[i][1]) * 100; $("#progressbar"+i).progressbar({ value: pval, max: 100 }); } });
i have written code make progressbar on td of each row of table. when doing 1 row worked fine, after i've added multiple rows in db, values not coming accurate. when value of pval
is 100, filling 1/4th of progress bar.
i unable replicate issue. may want edit post , include more details, example data, , errors generated console.
i created following test: https://jsfiddle.net/twisty/0v4q5a8z/
html
<div class="ui-widget"> <a href="#" id="getprogress" class="button">get progress</a> <table id="jobs" width="100%"> <tbody> </tbody> </table> </div>
javascript
var progress = [ ["p1", 100, 100], ["p2", 100, 75], ["p3", 100, 22] ]; function getprogress(source, target) { /* ajax post used example purposes ** example response: ** array [ ** ["p1", 100, 100], ** ["p2", 100, 80], ** ["p3", 100, 75] ** ] */ $.ajax({ url: source, data: { json: json.stringify(progress) }, type: "post", datatype: "json", success: function(responsetext) { var rt, pval; rt = responsetext console.log(rt.tostring()); (i = 0; < rt.length; i++) { target.append("<tr><td><div id='progressbar-" + + "' class='progressbar'></div></td></tr>"); pval = (rt[i][2] / rt[i][1]) * 100; $("#progressbar-" + i).progressbar({ value: pval, max: 100 }); } } }); } $(function() { $(".button").button(); $("#getprogress").click(function(e) { e.preventdefault(); getprogress("/echo/json/", $("#jobs")); }); });
this test works expected. code less intense. function be:
function getprogress(source, target) { $.getjson(source, function(responsetext) { var rt, pval; rt = responsetext (i = 0; < rt.length; i++) { target.append("<tr><td><div id='progressbar-" + + "' class='progressbar'></div></td></tr>"); pval = (rt[i][2] / rt[i][1]) * 100; $("#progressbar-" + i).progressbar({ value: pval, max: 100 }); } } }); }
Comments
Post a Comment