How to extract freehand writing from submitted PDF form? - javascript

I need to extract freehand writing from submitted PDF form or submit the writing as Base64 string (the form would submitted as XML in that case). i wold need to access the writing using PDF JavaScript, serialize it and submit it along other field values. how do I access the writing sing in-PDF JavaScript (http://www.adobe.com/devnet/acrobat/javascript.html)? Thanks

You can submit the handwriting created by the pencil tool as XML (XFDF format) to your server by setting the submit button to submit field data and comments. There's no need to use JavaScript if the user will just be pressing the button.
If you do need to access the functionality through a script, you can achieve the same thing by using this.submitForm() and setting the bAnnotations parameter to true. See link for further documentation.
http://help.adobe.com/en_US/acrobat/acrobat_dc_sdk/2015/HTMLHelp/index.html#t=Acro12_MasterBook%2FJS_API_AcroJS%2FDoc_methods.htm%23TOC_submitFormbc-106&rhtocid=_6_1_8_23_1_105
The "ink" annotations will be stored in the XML as a series of vertices that represent the strokes of the pencil tool. These can be imported into another PDF or rendered to an image for OCR... the Google Vision API does a pretty nice job of interpreting handwriting.

Related

Pre populate a file input

I'm working on a job board site which submits user applications to a third party site. The users have to provide following information while applying: name, contact details and resume. Since these fields are also available on user profile on the site, we want to pre populate the form fields, allowing users to change the information as they like.
Now, all other fields can be populated without an issue. However, file input field can't be populated due to security violations. Is there a work around possible using FILE API and BLOB objects?
What I'm planning to do is the following:
Create a blob object from file URL on server
Read the blob as an array buffer using FileReader.
Attach this file to file input field <- this is what I'm not able to figure out and need help with.
Also, if there is any alternate way to achieve this, please let me know. I'm using PHP and JavaScript to generate the form, so I can do the preprocessing in PHP.
Attach this file to file input field <- this is what I'm not able to figure out and need help with.
It is not possible to set a value at FileList object of <input type="file"> element.
You can create and append a File object to a FormData object and submit FormData using XMLHttpRequest()
var data = new FormData();
data.append("file", /* Blob | File */, "filename.ext")
Creating an answer just to give a little more insights into how I solved this issue, and why there was an issue in the first place.
Background: I've created a custom WordPress plugin for a client, which fetches the job applications from various sites, and displays them inline. We also allowed application submission, where the users could attach their resume, and the same was submitted to the original job posting. Since, a lot of users access the website on their mobile, they do not have the resume available on the same. In such a case, we wanted to offer them a facility to use a resume stored on their profile.
Potential Solution: The simplest way to do this would've been to fetch the file contents via ajax from user's profile, and attach it to the form before submission. However, for whatever reason, this didn't work.
Applied Solution: The solution that worked is pretty old school. Instead of submitting the application directly, we submitted it to an intermediate page, which fetched the file contents from user's profile, modified the form data and submitted via curl. This also saved the double data exchange on user's end (file download and re-upload).

Adobe LiveCycle Web Services Invocation

I have a simple form with a button (submit), two textbox fields and two hidden fields. On submit, I would like to pass in 3 parameters to a service using a WSDL URL. More specifically, I would like to pass in the ENTIRE form (including data entered in form) as a string (in xdp or pdf format) as one parameter and the values of the two hidden fields as two other separate parameters.
I am using Javascript to call the web service and pass in the parameters.
I have been struggling with trying to pass in the ENTIRE form as an xdp or pdf as a string parameter to call the web service. Is this even possible?
Thank you!
Yes. You can set that up inside the submit button settings, either sending form data as plain xml or xdp.
Well I couldn't figure out how to get the entire xdp. HOWEVER...
As it turns out I found out how to get the entire pdf.
You MUST get the base64 encoding in order to get the entire pdf. For some reason if you do not encode the Collab.documentToStream into base64 it doesn't return the entire pdf (only a small section of it). This is my solution:
var documentString = util.stringFromStream(SOAP.streamEncode(Collab.documentToStream(event.target), "base64"));
From that you can decode the string from base64 to ansi on the server side which should give you the entire pdf to be stored or opened.
I will accept this as an answer to my own question. I edited my original question for clarification.
It is bad practice to pass this in the URL. If you want to use a String, it should be passed in the body of the request (i.e. a REST endpoint that accepts a string input). Passing this in the URL could eventually reach the URL length limit if the form or data is long enough.

Save the client HTML content back to the Server as a HTML file

I want to create an HTML form on the Server. When the client completes the form and clicks submit, I want to be able to save HTML form and data in a single HTML file on the server.
The best suggestion I have seen is using JavaScript. Use a client side script that on click will save the document.InnerHTML to a var that can then be submitted back to the server.
Is this the best approach, or is there an easier way?
Even though I have no idea why you want to save the whole html code because I'm sure there will be parts that are the same for every user and you will be wasting memory, but ok.
So there are two ways to do this:
1. is javascript as you said
2. would be to put all the generated html code into a hidden form input (already on server side)
the first one seems more comprehensive and this is what I would do but the second one would also work for users with js disabled.
I wouldn't really recommend this way, because I'm still a huge fan of saving data in a database, but here's a general outline of what to do:
User fills out the form and submits.
Server-side code executes a method:
a. String holding the template for your HTML page with placeholders for the fields.
b. Use String.Format to put all the user input into the correct places.
c. Create a file, write the string to the file, and save.
d. Return file name to user.
HTML files are not that large, but still you risk using up your hard drive space. Also, you need write permissions which introduces security risks.
Going the database route:
1. User fills out the form and submits.
2. Server-side code saves the data to a database, and returns a link (with querystring string of ID and possibly a user id to help with security) to the user.
3. Whenever the user goes to the link, the server-side code repopulates the form with the ID passed.

Retrieve PDF from iframe

Is it possible to retrieve a PDF from an iframe and submit it back to the server?
My use case is to display a PDF form to the user, and let them submit the form after filling it out. I haven't found anything indicating this is possible, but I'm remaining hopeful for the moment.
You can add a submit button inside the PDF itself while generating it, and treat the data comming from your PDF form in the same way you would deal with an HTML form.
In order to achieve this, you will need to add a button annotation to your PDF form, and attach a "submit form" action to it. See Chapter 8 - Interactive Forms of the PDF Reference Document from Adobe for more details.
You can create then an asp.net page that processes the input from the PDF form. Note that the field names of a PDF form can be used in asp.net Request object to collect the data.
If you want to submit the whole file instead, you can do so by setting a flag in the "submit-form" action that you need to add to your PDF file, but I do not recommend doing this in general since it will consume more bandwidth from your server.

How to download a filled in form in PDF format using javascript or html

I have a html page with a form ,with few input fields, check box,radio buttons.
User can fill up the forms.
Is there any way , the user will be able to download the form (with the filled in data) in pdf format ?
1 more question, Any way to save the filled in form in html format or image format (of course File-> save of browser and screenshot are there) using java script code or html code , on a button click ?
I have tried http://code.google.com/p/jspdf/ , didnot able to get through it.
Thanks
[Adding a few more points]
if generating a pdf file using JS/HTML is not possible then ....
A bit more into it
Currently I am creating a server using C# application and when user requests a html page , I am sending the same to user.
that html page contains a form , which is needed to be filled
and I want the user to save the filled form in pdf format.
For now , I am able to process the static html form -> convert to pdf and provide the download to user ,
But can't get a way to enable the user to save the filled in form.
When the user presses the submit button , I can get all the filled in data using httpResponce object(GET/Post Method)!! , is there a way I can generate a pdf file using this httpResponce object parameters?
Or any way I can send the current html page content (e.g. getting all the contents in a div using jquery/javascript) and send it back, when user presses the submit button, in that way I can generate the pdf file at server side and provide a download - PDF format
Please ask , if I am not able to describe my question !!
jsPDF is an open-source library written by our lead developer, James,
for generating PDF documents using nothing but Javascript. You can use
it in a Firefox extension, in Server Side Javascript and with Data
URIs in some browsers. http://snapshotmedia.co.uk/blog/jspdf
Using only javascript to generate the PDF is not possible at this time. Using server-side scripting, it is possible to send the data to a server and let the server generate the PDF which is then sent to the user.
(Update): Using PHP, you can generate PDFs in the server-side using dompdf - HTML to pdf converter. Here is a demo: http://eclecticgeek.com/dompdf/docs_0-6-0/demo.php
In Google Chrome, there is a "Print to PDF" option. If you don't want to do any programming on the server side, you can just ask your users to access the page using Google Chrome. After filling out the form, they print the page as PDF.

Categories