Using forEachField function in form field

Technical Support
1

PDF.js Express Version

Detailed description of issue
I was trying out pdfjs express specially for its form mode and tried to get details of all the fields of this pdf file but while using forEachField I am getting everything as empty. Also when I consoled the field I got a response but it did not specify all the fields, I will include the screenshot of the response.

Screenshot from 2021-02-15 13-35-40
Screenshot from 2021-02-15 13-35-401920×1080 268 KB

Expected behaviour
I also tried using the same function on one of your demo pdf and it seems to work but not on the pdf that I have added the link for.

Link to document

Code snippet
CODE 1->

WebViewer(
      {
        path: '/webviewer/lib',
        initialDoc: '/files/f8879.pdf',
      },
      viewer.current,
    ).then(instance => {
      const { docViewer, annotManager } = instance;
    
      docViewer.on('documentLoaded', () => {
        docViewer.getAnnotationsLoadedPromise().then(() => {
          var stack = [];
          const fieldManager = annotManager.getFieldManager();
          fieldManager.forEachField(function(field) {
         stack.push(field); // Push root fields
         console.log(field)
       });
        while (stack.length > 0) {
         var current = stack.pop();
         if (current.isTerminal()) {
           // Work with terminal/leaf fields
         }
         else {
           // Traverse children
           stack = stack.concat(current.children);
         }
       }
        });
      });
    });

CODE 2 → 

WebViewer(
      {
        path: '/webviewer/lib',
        initialDoc: '/files/f8879.pdf',
      },
      viewer.current,
    ).then(instance => {
      const { docViewer, annotManager, fieldManager } = instance;
    
      docViewer.on('documentLoaded', () => {
    docViewer.getAnnotationsLoadedPromise().then(() => {
      // iterate over fields
      const fieldManager = annotManager.getFieldManager();
      fieldManager.forEachField(field => {
        console.log(field.getValue());
        field.setValue('new value');
      });
    });
  });
    });
2

Hey there!

You need to make sure to iterate over any children like you’re doing in your second code sample (although there are a few errors there).

This code should do it for you:

  const { docViewer, annotManager } = instance;

  const fieldManager = annotManager.getFieldManager()
    
  docViewer.on('documentLoaded', () => {
    docViewer.getAnnotationsLoadedPromise().then(() => {
        var stack = [];
        fieldManager.forEachField(function(field) {
          stack.push(field); // Push root fields
        });
        while (stack.length > 0) {
          var current = stack.pop();
          if (current.isTerminal()) {
            // Work with terminal/leaf fields
            console.log(current) // current is a `Field` class
          }
          else {
            // Traverse children
            stack = stack.concat(current.children);
          }
        }
    });
  });

Thanks!
Logan