How to add a button to a PDF that sends all the data to a REST API?

53 Views Asked by At

We need to create a PDF dynamically that is fillable.

I would like to add a button to the form that says Submit. When the user clicks on the button, all the form fields should be collected and a JS fetch call should send it to a server.

Is this possible using borb?

Here's an example:

layout.add(
    FixedColumnWidthTable(number_of_columns=2, number_of_rows=4)
    .add(
        JavaScriptPushButton(
            text="Submit Data",
            javascript="// GET THE FIELDS AND CALL FETCH USING POST VERB HERE.",
            horizontal_alignment=Alignment.RIGHT,
        )
    )
)
1

There are 1 best solutions below

1
K J On

There is no need for Javascript the forms submission is built into Acrobat and other (NOT All) PDF readers.

Here is a button that sends whatever the user enters to replace Hello world! Note the deliberate Mistake so if I change that to `Hello World! or my name then that is the data transmitted behind my back to Example.com, without me accepting any insecure JS code. enter image description here

The reply from the server will come back to my incoming folder.

enter image description here

OK this is embarrassing, apparently I shot them a blank PDF on the left, and got an equally reasonable "Thank you for your submission" on the right. Back to the manual then! *see edit below. However the point is any suitable text in the file will be sent out simply at the push of a button with the correct action, as provided by the text editor.

enter image description here

The offending section was this text code. It says send the data to a forms handler at remote https://www.example.com?incoming.php

5 0 obj
<</A<</F<</F(https://www.example.com?incoming.php)/FS/URL>>/Flags 514/S/SubmitForm>>/AP<</N 9 0 R>>/BS<</S/B>>/DA(0 g /Helv 12 Tf)/F 4/Ff 65536/FT/Btn/MK<</BC[0 0 0]/BG[.752941 .752941 .752941]/CA(Submit)>>/P 7 0 R/Rect[91.53846 650.30099 163.53845 670.30099]/Subtype/Widget/T(Button1)/Type/Annot>>
endobj

So what you need is a button statement (graphics are supplied by any suitable reader). With a send text action and a website that knows what to do for incoming and outgoing data fields.

  • [Edit] Apparently the code was good, it was me using example.com not a "Real Server" Correct transmit of the edited field is here. NOTE: it shows the manually corrected CAPS W, before I pressed Submit. Oddly the Acrobat DC transmittal is older 1.2 format not newer 1.4?

enter image description here

So just to confirm the newly assigned "WidGet" object that worked was:

% BUTTON ACTION (to send file currently set to a test site!, current parent is 9)
% Button1 is the /Title but can be anything like "E.T.PhoneHome" the major function is /Flags 512
7 0 obj
<</Type/Annot/Subtype/Widget/T (Button1)/FT/Btn/MK<</BC [0 0 0]/BG [0.75 0.75 0.75]/CA (Submit)>>/BS<</S/B>>
/A<</S/SubmitForm/Flags 512/F<</FS/URL/F (https://www.hashemian.com/tools/form-post-tester.php/12345)>>>>
/P 9 0 R/Rect [92 650 164 670]>>/AP <</N 11 0 R>>/DA (0 g /Helv 12 Tf)/F 4/Ff 65536
endobj

Looking at the Borb code, I am not sure that Joris used an AcroForm URL submit "ACTION" but a JavaScript in his response to https://github.com/jorisschellekens/borb/issues/42#issuecomment-1046043322