This entry was posted on Sunday, June 21st, 2009 at 10:39 pm and is filed under development, howto. You can follow any responses to this entry through the RSS 2.0 feed. You can leave a response, or trackback from your own site.
Hi all its us again, In the past few months we’ve been asked many a times to help improve the progressbar code. We’ve also been referenced by several websites as THE progressbar to use. In all, we felt we owed it to you guys to make it better.
So here we are, after all those emails and bug reports, we finally got down to it. Always good to take a couple of months to have a fresh prespective of things. We ripped out the old code and made it much better and more extensible than its predecessors. So much that we decided it was enough to qualify as a major revision.
Let see whats been done…
- Cleaned up the code, yes its lighter, cleaner faster. (Still lacks documentation though)
- Callbacks! Everyone’s favourite
- Max values, you can now set it to be 150/2000 instead of just a percentage
- Text formats. Show 75/100 or 75% by toggling the
textFormataccordingly - Steps, how many steps to get to your target value
- Step Duration, how long each step lasts
- Webkit (Chrome/Safari) compatibility. More like, Webkit Hacks
Once again, many a thanks for all those who have so generously provided the feature requests as well as bug fixes every now and then. And thanks for all your patience in waiting for this new release. ![]()
If its working for you, drop us a comment and tell us where we can see your stuff!
Download the new jQuery progressbar here: jQuery progressbar
or view the demo here
read users' comments (11)
11 Responses to “JQuery Progress Bar 2.0”
Leave a Reply
Most Popular
- HOWTO: PHP and jQuery upload progress bar (47)
- JQuery Progress Bar 1.1 (41)
- Howto: Repackageable custom extension development in Magento - Part 2 - Admin Controller (24)
- Howto: Repackageable custom extension development in Magento - Part 8 - CRUD - Update (13)
- HOWTO: struts 2 i18n (12)
- JQuery Progress Bar 2.0 (11)
- JQuery Progress Bar 1.2 (10)
- Howto: Repackageable custom extension development in Magento - Part 3 - Database (9)
- Howto: Repackageable custom extension development in Magento (8)
- Howto: Repackageable custom extension development in Magento - Part 5 - CRUD - Retrieve (6)
Recent Comments
- donald: Hi Wen, I have checked out
- donald: Hi Ashley, Currently, I simply use
- donald: Hi Noemi, there are many
- Serge: Thanks a lot. It's the simplest
- Zoran: Excellent posts you got here...
- Craig: Brilliant tutorial! There's NOTHING on
- Will: Thnak you! I was
- Margots: Thank you a lot for
- Aswin S: Wow great dude.. For the
- Noemi Heier: This is great! How did
Latest Entries
- jQuery Progress Bar Configuration
- Extracting email addresses from inbox
- 10 Good (Free and Legal) Source for Photos and Images
- Howto: Backup Microsoft SQL Server Database, as in Dump it to a SQL Script (like MYSQL's sqldump)
- Managing client's expectation with wireframe software
- Howto: Repackageable custom extension development in Magento - Part 9 - Frontend - List
- JQuery Progress Bar 2.0
- HOWTO: Find icons for your new prototype system
- Google Maps Helper
- laying the cornerstones

October 16th, 2009 at 11:38 am
Is JQuery Progress Bar 2.0 available under an MIT or equivalent license? I see a copyright notice, but no mention of a license. thanks.
October 12th, 2009 at 10:16 pm
Aha, never mind, I found my bug. The value I was passing was undefined, i.e. I was calling .progressBar(undefined) instead of .progressBar(30).
I suppose it might be a feature request to ask for progressBar to check for invalid arguments and raise an error instead of proceeding silently. But anyway now it seems to work great, thanks!
October 12th, 2009 at 4:40 pm
First of all, thanks for writing the JQuery Progressbar library! It looks really cool.
I’d like to use it, but I seem to keep running into a problem. You can see what I mean by viewing my test app at http://strassmann.com/pbar/. It’s the stub for a file upload tool.
If you start by clicking “start transfer” two or three times, a progress bar gets created just fine for each transfer. By “fine”, I mean I have passed a value for BarImage (the green progress bar) and the initial progress value is zero.
If you then click on “update all”, the bars seems to be reset completely. They don’t get updated (to 30%, as they should), and the bar image is
inexplicably reset to the red bar.
Would you mind if I asked you why this might not be working? Why would calling updateTask(), which simply calls {div}.progressBar(30)
mess up the bar?
many thanks,
Steve
August 14th, 2009 at 10:01 pm
I love this uploadprogress script but how do you stop it from sending packets after the stop button on my browser is pressed? It seems then when I press stop during an upload the uploadprogress bar will stop updating which is good but if I have a look at my internet connection I still see it sending packets. Whats the fix for that please?
July 6th, 2009 at 11:20 am
Sorry for double-posting but i’ve found the problem….
In your function getText(config) you should swith the config.running_value to the config.value.
This fixes the problem with the title bug
July 6th, 2009 at 11:18 am
ooo thanks!
yeah found the bug, will be updating the code shortly.
we were missing a
$bar.attr('title', getText(config));for the progress bar updates
July 6th, 2009 at 10:56 am
Hey, great plugin!
I have seem to found a bug though… The attribute “title” is not updated correctly, it always shows “0%” when we mouse over the bar.
I’ve been looking into the code and i haven’t figured it out yet.
Any ideas?
June 24th, 2009 at 8:11 am
sorry for posting too much, i just want to submit the form after finishing the upload,
replaced “location.reload(true);” with “document.getElementById(”uploadform”).submit();” but nothing happens
any ideas?
June 24th, 2009 at 5:11 am
THANK YOU VERY MUCH, everything is working beyond fine. i have done the backend php magic but for some reason i can’t detect the POST values of the iframe. since i need it to tell the user the image is uploaded without having the need to user the callback function
June 23rd, 2009 at 9:10 pm
Hey fadi,
good question!
The problem is about the granularity between the ajax calls and the actual post. 1 ajax call is made to check the status at 98%, the next ajax call is when the post has already finished, so we get a null response. There is no certain way to say if the file has been uploaded without some backend php magic.
I’ve fixed the example such that it reloads the page when the data returned is null. That should work. If need be, you can check for successive nulls (for graceful degeneration).
June 23rd, 2009 at 1:54 pm
thx for the update, finally its compatible with opera and chrome and safari. one question how can i refresh the page after uploading the image?? when i upload an image the bar stops at 98% but the image is upload, i want to refresh when the upload ends
thx again