OZ e-Form Developer
  • OZ e-Form Concepts
  • 🌈e-Form DEVELOPER
    • Day 1: Welcome On Board
      • About Course
      • Preparations
      • OZ e-Form Overview
    • Day 2: e-Form Design
      • Designer Environments
      • e-Form Layout Structure
      • e-Form Components
      • e-Form From Documents
      • Preview / Export / Save
      • Hands-on Practice
    • Day 3: Dynamic e-Form
      • e-Form Scripting Guide
      • Hands-on Practice
      • Advanced Features
    • Day 4: e-Form Application
      • Server Deployment
      • Viewer In HTML
      • Viewer APIs
      • Prefilling e-Form
      • Submitting e-Form
      • Sending MemoryStream
    • Get Your Certificate
    • Design Guide
      • Dialogue Flow
        • Overview
        • Creating Dialogue Flow
        • Uploading e-Form to Server
        • Running Dialogue Flow
        • Group and Statement
        • Custom Styling
      • Multilingual e-Form
      • Miscellaneous
      • Videosign
        • Videosign User Guide
      • OZ Verifier
        • OZ Verifier Introduction
        • Implementation and Use
        • Requirements
      • HTML5 Editor
        • HTML5 Editor Introduction
        • HTML Editor
        • Requirements and Sample
    • Day 5. Server & Reporting
  • 🌈Server Developer
    • OZ Server Console
    • OZ Scheduler
      • Features
      • Installing OZ Scheduler
      • Scheduler Task
    • Binding & Exporting
      • Overview
      • Export API Example
        • Extract Input Data
        • Export with OZ Server
        • Export with Scheduler
        • Export with Scheduler Task
    • Repository Server
    • Sync Server
      • Overview
      • Installing Sync-Server
        • SSL configration
      • Sample Application
      • Implementation
    • QR Link Mobile Sign
  • 🌈Report Developer
    • Overview
      • About Course
      • Preparation
      • Report Designer Overview
    • Query Design
      • Database Connection
      • Designer Environment
      • Dataset Design
    • Report Design
      • Designer Environment
      • Components
      • Table
      • Master-Detail
      • ODI Parameter
      • CrossTab
      • Chart
  • 🌈MOBILE DEVELOPER
    • Android Native
    • iOS Native
    • TOTO Framework
      • TOTO Overview
      • Sample App Overview
      • Server Application
      • Android Project
  • ⬇️Product Downloads
  • 📚 Product Documentation
  • 📕Technical Guide
  • ⚛️ ReactJS Integration
Powered by GitBook
On this page

Was this helpful?

Last updated 2 years ago

Was this helpful?

How it Works

  1. The sample opens an empty viewer first.

  2. Select and open an OZR from the select option repository_files/demo.

  3. Enter your input data in the form.

  4. Click the Export button. The current open form will be exported to the server in the specified format.

  5. The exported target file will be listed in the pane webapps/EXPORT.

  6. You can open exported files again.

Features

Client

  1. Open an empty viewer

  2. Open OZR/OZD in the empty viewer

  3. Export OZR/OZD to OZD/PDF and send OZD/PDF to the server

Server

  1. Receive OZD/PDF from the client and save it as OZD/PDF

Implementation

License

The OZ Server Binding license is required in the OZ Server license file as below.

USE-SERVERBIND="TRUE"

Open Empty Viewer

  • Set the viewer parameter viewer.emptyframe to true.

Open OZR

Open OZD

  1. Create a folder named EXPORT under the webapps folder.

  2. Get OZD from the viewer.

  3. Save it to the EXPORT and repository_files.

Close Viewer

Client-Side Exporting with MemoryStream

Side
Action
Option
Description
<!DOCTYPE html>
<html style="height:100%">
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge"/>
<!-- HTML5 Viewer references-->
<script src="http://code.jquery.com/jquery-2.0.3.min.js"></script>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css" type="text/css"/>
<script src="http://code.jquery.com/ui/1.12.1/jquery-ui.min.js"></script>
<link rel="stylesheet" href="/html5viewer/ui.dynatree.css" type="text/css"/>
<script type="text/javascript" src="/html5viewer/jquery.dynatree.js" charset="utf-8"></script>
<script type="text/javascript" src="/html5viewer/OZJSViewer.js" charset="utf-8"></script>
</head>
<body style="width:98%;height:98%">
<div id="OZViewer" style="width:98%;height:98%"></div>

<script type="text/javascript" >

function SetOZParamters_OZViewer()    {    
    var oz = document.getElementById("OZViewer");
    oz.sendToActionScript("viewer.emptyframe", "true");    
    return true;
}
start_ozjs("OZViewer", "/html5viewer/");

</script>
</body>
</html>
<!-- Add a button to open OZR-->
<input type="button" value="OpenOZR" onclick="openForm('ozr')" >
// Add a function to open OZR by the button OpenOZR
function openForm(type){    
    if (type == "ozr") {
        var url = "forcs/john.kim/customer.ozr";
        var param = "connection.reportname=" + url + "; ";
    } 
    param += "connection.servlet=/training/server; ";
    param += "viewer.pagedisplay=singlepagecontinuous; ";
    param += "viewer.viewmode=fittoframe; ";
    param += "eform.signpad_type=dialog; ";
    param += "comment.all=true; ";
    param += "comment.selectedpen=highlightpen; ";
    OZViewer.CreateReportEx(param, ";");
}
<!-- Add a button to open OZD -->
<input type="button" value="OpenOZD" onclick="openForm('ozd')" >
// Add lines to open OZD
function openForm(type){    
    if (type == "ozr") {
        var url = "forcs/john.kim/customer.ozr";
        var param = "connection.reportname=" + url + "; ";
    } else if (type == "ozd") {
        //var url = "ozp://forcs/john.kim/customer.ozd"; 
        var url = "http://localhost:8080/EXPORT/customer.ozd";       
        var param = "connection.openfile=" + url + "; ";
    }
<!-- Add a button to close OZR/OZD -->
<input type="button" value="Close" onclick="closeForm()" >
// Add a function to close OZR/OZDS
function closeForm() {
    OZViewer.Script("close"); // The last viewer will be closed first
    //OZViewer.Script("closeall"); // Remove all open viewer
}

Client

  1. ScriptEx("save_memorystream") converts the form as a memory stream in the specified format (OZD or PDF) and raises the event OZExportMemoryStreamCallBack.

  2. ExportMemoryStreamCallBack_OZViewer(outputdata) triggered by OZExportMemoryStreamCallBack event receives the memory stream encoded in base64 with outputdata argument.

  3. Sends the memory stream to the server application in the function OZExportMemoryStreamCallBack_OZViewer

Server

  1. Receives the memory stream, decodes it, and saves it as a file in the target format.

  2. Sends the target file path to the client.

Client

  1. streamCallback receives the target file path.

<!-- Add a button and form -->
<input type="button" value="ExportStream" onclick="exportStream()" >
<form id="form">	
    <input type="hidden" id="fileName" name="fileName">
    <input type="hidden" id="targetFormat" name="targetFormat">
    <input type="hidden" id="stream"	name="stream">
</form>

// Add JavaScript
var fileName = "customer.ozr"; // or ozd
var targetFormat = "ozd"; // or pdf

function exportStream() {
    var param = "export.format=" + targetFormat;
    param += "; export.path=C:\\TEMP;"
    param += "; export.filename=temp"; 
    param += "; export.mode=silent";
    param += "; export.confirmsave=false";
    param += "; ozd.allowreplaceformparam=true";
    param += "; pdf.savecomment=true";
    OZViewer.ScriptEx("save_memorystream", param,";");                     
}

function OZExportMemoryStreamCallBack_OZViewer(outputdata) {
    if(outputdata == "{}") {
      alert("Export failed.");
    }else {
        var obj = eval('(' + outputdata + ')');
        var value = null;
        for(var key in obj) value = obj[key];

        $('#fileName').val(fileName);
        $('#targetFormat').val(targetFormat);
        $('#stream').val(value);
        var param = $('form').serialize();    

        $.ajax({
            type : "POST",
            url : "./save-stream.jsp",
            data : param,
            async : false,
            success : streamCallback,
            error : function(request, status, error) {
                if (request.status != '0') {
                    alert("code : " + request.status + "\r\nmessage : "    + request.reponseText + "\r\nerror : " + error);
                }
            }
        });
    }       
}
var streamCallback = function(path){
    alert(path);
};
<%@ page language="java" import="java.io.*,sun.misc.*,org.xml.sax.InputSource,org.w3c.dom.*, javax.xml.parsers.*, java.util.*, java.text.*" contentType="text/html; charset=UTF-8" autoFlush="true"%><%!
    public String encoder(String key) {
        return new BASE64Encoder().encode(key.getBytes());
    }
    public byte[] decoder(String cipher) throws IOException {
        return new BASE64Decoder().decodeBuffer(cipher);
    } 
%><%
try {
    request.setCharacterEncoding("utf-8");
    String path = "C:/Program Files/Apache Software Foundation/Tomcat 9.0/webapps/EXPORT/"; 
    String fileName = request.getParameter("fileName");
    String targetFormat = request.getParameter("targetFormat");
    String base64Str =  request.getParameter("stream");

    String file = fileName.substring(0, fileName.length()-4);
    int i = file.indexOf('-');
    if (i > 0) {
        file = file.substring(0, i);
    }

    String targetFile = file + "-" + timeStamp + "." + targetFormat;
    String targetPath = path + targetFile;

    byte[] decodedBytes = new BASE64Decoder().decodeBuffer(base64Str.substring(base64Str.indexOf(",")+1));
    try {    
        FileOutputStream fout = new FileOutputStream(targetPath);
        fout.write(decodedBytes, 0, decodedBytes.length);
        fout.close();
        out.println(targetPath);
    } catch (IOException e) {
        e.printStackTrace();
    } 
}
catch(Exception e) {
    out.print(e.getMessage());
} finally {
}
%>

export.path=C:\TEMP

path for the save option

export.filename=temp

file name for the save option

export.mode=silent

no Save diaog box

export.confirmsave=false

no Save as window

pdf.savecomment=true

export to pdf with comments

ozd.allowreplaceformparam=true

allow created OZD to receive parameter values

save_memorystream

save as a memory stream

save

save as a file on the client

  1. 🌈e-Form DEVELOPER
  2. Day 4: e-Form Application

Sending MemoryStream

PreviousSubmitting e-FormNextGet Your Certificate
  • How it Works
  • Run sample
  • Features
  • Implementation
  • License
  • Open Empty Viewer
  • Open OZR
  • Open OZD
  • Close Viewer
  • Client-Side Exporting with MemoryStream
Run sample