how to extract data from an online interactive form using xml

SAP COMMUNITY NETWORK SDN - sdn.sap.com | BPX - bpx.sap.com | BOC - boc.sap.com | UAC - uac.sap.com

© 2010 SAP AG 1

How to extract data from an

Online Interactive Form using XML

parsing in WebDynpro Java – Part

2

Applies to:

This article applies to WebDynpro Java/Adobe Interactive Forms development in SAP NetWeaver 7.0 and Adobe LiveCycle Designer 8.0 or higher release. Demo application created for this article has been developed in SAP NetWeaver 7.0 EHP1. For more information, visit the User Interface Technology Homepage and SAP Interactive Form by Adobe.

Summary

This article tells about how to extract data from an Online Interactive Form using XML parsing in WebDynpro Java.

Author: Suresh Thiyagarajan

Company: Tata Consultancy Services

Created on: 20 October 2010

Author Bio

Suresh Thiyagarajan is a SAP NetWeaver Consultant at Tata Consultancy Services, India. His areas of expertise in SAP technologies include WebDynpro Java, WebDynpro ABAP, Enterprise Portal and Adobe Interactive Form development.

http://www.sdn.sap.com/irj/sdn/nw-ui

http://www.sdn.sap.com/irj/sdn/nw-ui

http://www.sdn.sap.com/irj/sdn/adobe

How to extract data from an Online Interactive Form using XML parsing in WebDynpro Java – Part 2


© 2010 SAP AG 2

Table of Contents

Introduction ......................................................................................................................................................... 3

Scenario .......................................................................................................................................................... 3

WebDynpro Development Component ............................................................................................................... 4

Creating context structure ............................................................................................................................... 4

Enhancing Interactive Adobe Form Design .................................................................................................... 4

Creating action handler for ‘onSubmit’ event in the InteractiveForm UI ......................................................... 7

Steps to Extract Data from the Adobe Form using XML Parsing ....................................................................... 8

Creating Java Class for XML Parsing ............................................................................................................. 8

Code Snippet of ParseXML java class ............................................................................................................ 9

Creating methods in the component controller ............................................................................................. 11 Code Snippet of getFormData() method .................................................................................................................... 12

Code Snippet of displayParsedData() method ........................................................................................................... 13

Calling component controller methods from the view ................................................................................... 13

Build & Deploy .................................................................................................................................................. 14

Related Content ................................................................................................................................................ 16

Disclaimer and Liability Notice .......................................................................................................................... 17



© 2010 SAP AG 3

Introduction

This is the part 2 of a three part series of articles on Adobe Interactive Forms development. In Part 1, we have seen how to add and remove subform instances at runtime. In part 2, we will discuss how to extract data from subform instances using XML parsing in an Online Interactive Form through WebDynpro Java. Extracted data from the Adobe Form will be stored in a value node and finally updated into R/3 table using a RFC.

Scenario

In part 2, we will continue to use the Personal Information Form from part 1 to illustrate the data extraction. The one addition to the Personal Information Form used in Part 1 is a ‘Save’ button added to the end of the form.

http://www.sdn.sap.com/irj/scn/index?rid=/library/uuid/b04abedd-fab8-2d10-fe8b-fa6901a7737b



© 2010 SAP AG 4

WebDynpro Development Component

We will continue to use the DC poc_adobe_form and the view OnlineAdobeFormView from part 1.

Creating context structure

For this part, additional nodes and attributes need to be created to store the parsed data from Adobe Form. A screenshot of the context structure from component controller as well as descriptions of the new nodes are given below.

TempFamilyDetails – Stores the parsed data from Family Details section of the Adobe Form.

TempPersonalDetails – Stores the parsed data from Personal Details section of the Adobe Form. This node should be context mapped to the view OnlineAdobeFormView.

Enhancing Interactive Adobe Form Design

Upon clicking on the ‘Save’ button, data entered by the user in the Adobe Form has to be extracted and stored into the newly added value nodes. To add the ‘Save’ button to the form, start by navigating to OnlineAdobeFormView select Outline tab select InteractiveForm UI Right Click Edit. The Adobe Livecycle Designer opens in the SAP NetWeaver Developer Studio with the Design View as the default view in the center as shown below.



© 2010 SAP AG 5

Note: Before adding the button in the Design View, make sure that the content type for Main_SubForm body page is set to Positioned (the content type was set as ‘Flowed’ at the end of part 1).

Now insert the following UI elements into the body page Main_SubForm of the form.

Button_SubForm – Add a subform to the Design View, name it as Button_SubForm and change the content type as Positioned.

Save_Button – Next a Submit button needs to be added from WebDynpro Native object library into the subform Button_SubForm. For this open the Object Library palette Webdynpro Native menu Drag and drop Submit button UI into Design View. Rename the display name of this button as ‘Save’.



© 2010 SAP AG 6

A piece of Java Script code will be automatically generated for the ‘Click’ event of ‘Save’ button in the script editor. This script code should look like the one below.

Upon completion of design, the screen should look similar to the one shown below.

Note: After adding the button section in the Design View, make sure that the content type for Main_SubForm body page

is set back to Flowed.



© 2010 SAP AG 7

Creating action handler for ‘onSubmit’ event in the InteractiveForm UI

Clicking on the ‘Save’ button will trigger the ‘onSubmit’ event of the InteractiveForm. Now an action handler has to be created for ‘onSubmit’ event in the WebDynpro view.

For this, from InteractiveForm UI Properties tab select ‘onSubmit’ event Create an action handler with name ‘SaveFormData’.



© 2010 SAP AG 8

Steps to Extract Data from the Adobe Form using XML Parsing

For XML parsing, we will be using DOM parsing APIs to extract data from the Adobe Form. The following links can help to know more about DOM APIs – Link 1 and Link 2.

Below given are the steps to extract data from the Adobe Form:

Get the XML data from the PDF Form using WebDynpro APIs IWDPDFDocumentHandler, IWDPDFDocumentAccessibleContext and IWDPDFDocument.

Create an instance of DocumentBuilder using DocumentBuilderFactory and parse using builder object to get DOM representation of the XML file.

Get the root element from the DOM object. From the root element get all Family Details elements.

For each Family Details element, get both the node name and node value for fields Name, Age and Relationship. Create a HashMap object and add it to the list.

To store both the node name and values in the insertion order, create an Array List object and add all HashMap objects to the array list.

Finally iterate the array list and store parsed data in value node.

Creating Java Class for XML Parsing

Create a Java class in the component controller (//@@begin others) and name it as ParseXML. This class should contain following methods which are used to parse the data from Adobe Form.

public InputStream readXMLSource (byte[] pdfData)

public ArrayList parseXMLDocument (InputStream XMLSource)

public Document parseDOMXMLFile (InputStream XMLSource)

public String getElementValue (Node nodeData)

public void writeDocumentToArrayList (Node node)

IWDMessageManager class is used to display Success or Error message. To access this message class globally either in the view or component controller, create an object in the component controller (//@@begin others) and initialize the method in wdDoInit () as shown below.

//@@begin others

IWDMessageManager msgMgr = null;

//@@end

//@@begin javadoc: wdDoInit () /** Hook method called to initialize controller. */ //@@end public void wdDoInit () { //@@begin wdDoInit () msgMgr = wdComponentAPI.getMessageManager(); //@@end

}

http://developerlife.com/tutorials/?p=30

http://www.w3.org/DOM/



© 2010 SAP AG 9

Code Snippet of ParseXML java class

The following screen represents entire ParseXML class,

//@@begin others IWDMessageManager msgMgr = null; /** This class represents short example how to parse XML file, * get XML nodes structure and its values. **/ public class ParseXML { ArrayList dataObj = new ArrayList(); /** This method used to extract the entire XML source with data from the PDF Form * @param pdfData holds PDF data as byte * @return XMLSource as InputStream **/ public InputStream readXMLSource(byte[] pdfData) { InputStream XMLSource =null; try { // create an instance for IWDPDFDocumentAccessibleContext IWDPDFDocumentAccessibleContext documentAccessibleContext = WDPDFDocumentFactory.getDocumentHandler().getDocumentAccessibleContext(); // set the PDF data as byte to the PDFDocumentAccessibleContext instance documentAccessibleContext.setPDF(pdfData); // call the server to get the XML data IWDPDFDocument document = documentAccessibleContext.execute(); // get the XML data in a InputStream XMLSource = document.getData(); } catch(Exception e) { msgMgr.reportException("Error in reading XML data from PDF."+e.getMessage(), false); } return XMLSource;

} /** Calls parseDOMXMLFile() method which returns XML document * Finally write node and its child nodes into ArrayList * @param XMLSource holds XML data as InputStream * @return ArrayList object */ public ArrayList parseXMLDocument(InputStream XMLSource) { // parse XML document from Inputstream of the XML Source Document doc = this.ParseDOMXMLFile(XMLSource); // get root node(as XML tag) of XML tree structure Node root = doc.getDocumentElement(); // call the method writeDocumentToArrayList() this.writeDocumentToArrayList(root); return dataObj;

}



© 2010 SAP AG 10

/** Method will parse XML Source and returns DOM XML document. * @param XMLSource holds XML data as InputStream * @return XML document */ public Document parseDOMXMLFile(InputStream XMLSource) { DocumentBuilder docBuilder = null; Document doc = null; // get the DocumentBuilderFactory instance DocumentBuilderFactory docBuilderFactory = DocumentBuilderFactory.newInstance(); docBuilderFactory.setIgnoringElementContentWhitespace(true); try { // using DocumentBuilderFactory get an instance of document builder docBuilder = docBuilderFactory.newDocumentBuilder(); } catch (ParserConfigurationException e) { msgMgr.reportException("Wrong parser configuration: " + e.getMessage(),false); } try {

// parse using builder to get DOM representation of the XML file doc = docBuilder.parse(XMLSource); } catch (SAXException e) {

msgMgr.reportException("Wrong XML file structure: " + e.getMessage(),false); } catch (IOException e) { msgMgr.reportException("Could not read source file: " + e.getMessage(),false); } return doc;

}

/** Iterate all child nodes from nodeData to get corresponding node value * @param nodeData holds node data (it is XML tag) * @return node value or else empty String */ public String getElementValue(Node nodeData) { Node node; // if nodeData has child nodes, it will go to next statement if(nodeData != null && nodeData.hasChildNodes()) { // iterate all child nodes from nodeData to get corresponding node value for(node = nodeData.getFirstChild(); node != null; node = node.getNextSibling()) { // if node type is Text_Node, it will return corresponding node value if(node.getNodeType() == Node.TEXT_NODE) { return node.getNodeValue(); } } } return ""; }



© 2010 SAP AG 11

Creating methods in the component controller

Create two methods - getFormData() and displayParsedData() in the component controller with the return type as void. The method getFormData() does the actual XML parsing by making use of the Java Class ParseXML, while displayParsedData() displays the parsed data by iterating through the value node.

After creating these methods in the Poc_Adobe_FormComp component controller, switch to the Implementation page and add the following source code to the getFormData() method.

/** Writes node and all child nodes into HashMap recursively * with the node name and corresponding node value. * @param node holds XML node tag from XML tree */ public void writeDocumentToArrayList(Node node) { HashMap nodeData = new HashMap(); // get the node name from the node parameter String nodeName = node.getNodeName(); // call the method getElementValue() to get node value for nodeName String nodeValue = this.getElementValue(node); // add both the node name and node value into HashMap nodeData.put(nodeName,nodeValue); // add HashMap object in Array List to maintain the order of insertion data dataObj.add(nodeData); // get all child nodes from node as XML tag and iterate it recursively NodeList children = node.getChildNodes(); for(int i = 0; i < children.getLength(); i++) { Node child = children.item(i); /** if child node type is Element_Node (means child node has any elements), * it will iterate all elements from the child node recursively. */ if (child.getNodeType() == Node.ELEMENT_NODE) { writeDocumentToArrayList(child); } } } }

// ParseXML Java class ends

//@@end



© 2010 SAP AG 12

Code Snippet of getFormData() method

public void getFormData( ) { //@@begin getFormData() InputStream XMLSource=null; IPublicPoc_Adobe_FormComp.ITempFamilyDetailsElement tempFamilyDtlsEle = null; try { wdContext.nodeTempFamilyDetails().invalidate(); // creating a object for the ParseXML class ParseXML parseXML = new ParseXML(); // call the method readXMLSource() from ParseXML class XMLSource = parseXML.readXMLSource(wdContext.currentPdfSourceNodeElement().getPdfSource()); // call the method parseXMLDocument() from ParseXML class ArrayList arrayList = parseXML.parseXMLDocument(XMLSource); // iterating stored values from the array list object to get family details for(int i=0;i<arrayList.size();i++) { // converting array list into hash map HashMap nodeData = (HashMap)arrayList.get(i); Set keySet = nodeData.keySet(); Iterator keySetIterator = keySet.iterator(); String nodeName = (String)keySetIterator.next(); String nodeValue = (String)nodeData.get(nodeName); /** comparing attribute name bound in Adobe Form with node name stored in HashMap. * if both name matches, get the corresponding node value and store in value node.*/ if(nodeName.equalsIgnoreCase("FamilyDetails"))

tempFamilyDtlsEle = wdContext.nodeTempFamilyDetails().createTempFamilyDetailsElement(); if(nodeName.equalsIgnoreCase("Name")) tempFamilyDtlsEle.setName(nodeValue); if(nodeName.equalsIgnoreCase("Age")) { if(nodeValue.equalsIgnoreCase("")) tempFamilyDtlsEle.setAge(0); else tempFamilyDtlsEle.setAge(Integer.parseInt(nodeValue)); } if(nodeName.equalsIgnoreCase("Relationship")) { tempFamilyDtlsEle.setRelationship(nodeValue); wdContext.nodeTempFamilyDetails().addElement(tempFamilyDtlsEle); } } } catch(Exception e){ msgMgr.reportException("Error in the method getFormData() :"+e.getMessage(),false); } //@@end

}



© 2010 SAP AG 13

Add the following source code to the displayParsedData() method.

Code Snippet of displayParsedData() method

Calling component controller methods from the view

Call both the methods getFormData() and displayParsedData() of the component controller from view action handler ‘SaveFormData’ as shown below.

Note: WDInteractiveFormHelper.transferPDFDataIntoContext (byte [] pdfSource, IWDNode targetNode)

Method transferPDFDataIntoContext extracts data from a PDF document and copies the values into the Web Dynpro Context (specifically to a value node of cardinality of 1:1). The XML structure of the document data is applied starting from the specified target node. Usually, this node should be the same context node to which InteractiveForm-UI element property dataSource is bound during PDF generation.

public void displayParsedData( ) { //@@begin displayParsedData () // displaying the parsed data from the value node. msgMgr.reportSuccess("First Name:"+ wdContext.currentTempPerosnalDetailsElement().getFirstName()); msgMgr.reportSuccess("Last Name:"+ wdContext.currentTempPerosnalDetailsElement().getLastName()); for(int j=0; j<wdContext.nodeTempFamilyDetails ().size (); j++) { msgMgr.reportSuccess ("Name =“ +wdContext.nodeTempFamilyDetails().getTempFamilyDetailsElementAt(j).getName() +"; Age = "+wdContext.nodeTempFamilyDetails().getTempFamilyDetailsElementAt (j).getAge() +"; Relarionship = +wdContext.nodeTempFamilyDetails().getTempFamilyDetailsElementAt(j). getRelationship()); } //@@end

}

public void onActionSaveFormData(com.sap.tc.webdynpro.progmodel.api.IWDCustomEvent wdEvent ) { //@@begin onActionSaveFormData(ServerEvent) // extracts data from a PDF Form and copies the values into the WebDynpro Context WDInteractiveFormHelper.transferPDFDataIntoContext(wdContext.currentPdfSourceNodeElement().getPdfSource(),wdContext.nodeFormDataNode()); // store parsed data from PersonalDetails node to TempPersonalDetails node wdContext.currentTempPerosnalDetailsElement().setFirstName(wdContext.currentPersonalDetailsElement().getFirstName()); wdContext.currentTempPerosnalDetailsElement().setLastName(wdContext.currentPersonalDetailsElement().getLastName()); // call the component controller methods wdThis.wdGetPoc_Adobe_FormCompController().getFormData(); wdThis.wdGetPoc_Adobe_FormCompController().displayParsedData(); //@@end

}

http://help.sap.com/javadocs/NW04s/current/wd/com/sap/tc/webdynpro/progmodel/api/IWDNode.html



© 2010 SAP AG 14

Build & Deploy

Build and deploy the project from NetWeaver Developer Studio. Upon executing the OnlineInteractiveFormApp application, the output in Internet Explorer browser should be similar to the screen below.

Finally clicking upon ‘Save’ button, the data is extracted from the Adobe Form and stored in the value nodes in WebDynpro context. The value nodes are then iterated through and the parsed data is displayed using message class as shown below.



© 2010 SAP AG 15

Note: The next article will discuss about extracting data from an Offline Interactive Form using XML parsing based on

upload functionality in WebDynpro Java.



© 2010 SAP AG 16

Related Content

How to Add or Remove Subform Instance at Runtime in Adobe Interactive Forms

Parsing XML file in Java

About DOM - Link 1 and Link 2

SAP Interactive Forms by Adobe

Webdynpro Java User Interface Technology

For more information, visit the WebDynpro Java Homepage.

http://www.sdn.sap.com/irj/scn/index?rid=/library/uuid/b04abedd-fab8-2d10-fe8b-fa6901a7737b

http://labe.felk.cvut.cz/~xfaigl/mep/xml/java-xml.htm

http://developerlife.com/tutorials/?p=30

http://www.w3.org/DOM/

http://www.sdn.sap.com/irj/sdn/adobe

http://www.sdn.sap.com/irj/sdn/nw-wdjava

http://www.sdn.sap.com/irj/sdn/nw-wdjava



© 2010 SAP AG 17

Disclaimer and Liability Notice

This document may discuss sample coding or other information that does not include SAP official interfaces and therefore is not supported by SAP. Changes made based on this information are not supported and can be overwritten during an upgrade.

SAP will not be held liable for any damages caused by using or misusing the information, code or methods suggested in this document, and anyone using these methods does so at his/her own risk.

SAP offers no guarantees and assumes no responsibility or liability of any type with respect to the content of this technical article or code sample, including any liability resulting from incompatibility between the content within this document and the materials and services offered by SAP. You agree that you will not hold, or seek to hold, SAP responsible or liable with respect to the content of this document.

how to extract data from an online interactive form using xml

Documents