File Chooser example

The index.html file containing JavaScript that makes use of the File Chooser API functionality is listed below.

<!DOCTYPE html>
<html manifest="manifest.appcache">
  <head>
    <title>File Chooser API usage example</title>
    <link rel="x-antenna-managed-webapp-descriptor" href="webapp-descriptor.xml" />
    <script type="text/javascript">

    function printText(str) {
      var d = document.getElementById('text-box');
      d.appendChild(document.createTextNode(str));
      d.appendChild(document.createElement('br'));
      d.scrollTop = d.scrollHeight;
    }

    function getFile() {
      window.launchbox.FileChooser.getFile({
        'onSuccess' : function(result) {
          printText('File path - ' + result.filePath);
          printText('File size - ' + result.fileSize);
        },
        'onFailure' : function(error) {
          printText('Error: ' + error.description + '!');
        }
      });
    }

    init();

    function clearOutput(){
      var d = document.getElementById('text-box');         
      d.innerHTML = "";
    }
    </script>
  </head>

  <body>
    <header>
      <h3><span>File Chooser API Usage Example</span>
      </h3>
    </header>
    <input type="button" onclick="getFile();" value="get File" />
    <input type="button" onclick="clearOutput();" value="clear" />
    <div id="text-box"></div>
  </body>
</html>

The contents of the cache manifest file called manifest.appcache for this application are listed below:

CACHE MANIFEST

CACHE:
index.html

NETWORK:
*

The webapp-descriptor.xml file for this application is defined in the following way:

<?xml version="1.0" encoding="UTF-8"?>
<webapp-descriptor
    xmlns="http://www.antennasoftware.com/application-hosting/web-app-descriptor/2.0">
    <id>com.pega.sample.filechooser</id>
    <version>1.0.0</version>
    <name>File Chooser API usage example</name>
</webapp-descriptor>

File Chooser

File Chooser example

Related topics