Expand my Community achievements bar.

Learn about Edge Delivery Services in upcoming GEM session

Form completion progress bar

Avatar

Level 3

How do I make a progress bar to show the amount of populated fields in a form?

I remember an example posted here on the forum, but can no longer find it.

It was a sliding "progress bar" that increased as you populated fields in the form.

As the form fields were filled in, the progress bar moved up the scale.

When all fields were populated the progress bar was "full".

Thanks for any help!

10 Replies

Avatar

Level 10

Hi,

There is a sample here: Progress Tracker

I tried the thermometer version (here is an updated form https://acrobat.com/#d=Gr-886Vmo7EQ*niQs4HXxQ), but I could not get the thermometer to display on the current form. If you open two documents, the thermometer appears in the other window and NOT that of the form itself.

Acrobat.png

Would be interested to see the thermometer working reliably.

Hope that helps,

Niall

Avatar

Former Community Member

Niall,

About the "double-document thermometer". Calling app.thermometer.end() before initializing it should resolve the issue. My guess it's subject to sloppy (internal) clean up, being a global object.

Avatar

Level 10

Hi c@tc.se,

I placed a .end() in the docReady and that sorted the thermometer appearing in a different PDF - thanks.

I am still having difficulty getting the thermometer to visually display the progress. It appears to lag "1" behind the actual progress.

Here is a sample:

https://acrobat.com/#d=2a2vSZNLNEQYpavckZkOGQ

I can see it setting the right progress value, but then it jumps back:

Acrobat1.png

The thermometer text is correct, just not the blue bar.

Any ideas? Thanks,

Niall

Avatar

Former Community Member

The 'jumping back' would be due to reinitializing the thermometer every time calculate is triggered. There's no need to call begin() or set the duration more than once per thermometer session.

About the 'odd jumping' problem; after some testing I'm bound to doubt the possibility of invoking a thermometer with a value other than 0. Your thermometer is invoked with value=1, although the progress bar stays put at 0.

A solution would be to invoke the thermometer before filling out the first field (whereas value really is 0). However Acrobat doesn't seem to keen on jump-starting thermometers on startup (whether it's initialize, form:ready or docReady). I've also tried app.setTimeOut() with no luck. Although enter- and exit-events do the trick, I'm convinced there are better solutions...

Avatar

Level 10

Thanks, I think it is too flaky for the purpose of tracking progress in filling fields.

Thanks anyway,

Niall

Avatar

Level 3

Thanks guys.

It would be nice to see the thermometer work propery as it looks quite slick.

Niall - how can I make your solution work across multiple pages / subforms?

Avatar

Level 10

Hi,

Here is a sample: https://acrobat.com/#d=1Evwijur*lEdxMmlWClE7g

It uses a function to count the objects in the form, so will work across multiple pages. It also counts the fields that are null.

It really isn't practical, as the function is called from the layout:Ready event so performance takes a real hit. Also there are several issues that you need to look out for (see notes).

Its a case of "just because you can do it, doesn't mean that you should".

If any one can improve on the solution, it would be great to share it here.

Niall

Avatar

Level 1

Hello Niall O'Donovan ,

could zou pls. update your download link, it is nit working anymore. Thanks in advance!

Avatar

Level 1

Hello All,

My form has 8 fields to fill. A form comletion bar would be a very nice thing. Any comments, ideas are highly appreciated.

Regards,

Florian

Avatar

Level 1

...Would it be possible to adap following script to PDF forms 8 fields? That means for each field, which is filled out status bar shows 12,5% progress.

var therm;

var bOpen = true;

function AdvanceTherm(nPg)

{

  therm.text = "On Page number " + (nPg+1).toString();

  therm.value = nPg;

  therm.text = "On Page number " + (nPg+1).toString();

  therm.value = nPg;

}

function EndTherm()

{

  therm.end();

}