Attaching a .pdf file to an object

142 views
Skip to first unread message

Mitch Weyuker

unread,
Nov 8, 2009, 5:23:21 PM11/8/09
to InterSystems: Zen Community
I am trying to accomplish the following:

1. From within a form that is used to create or edit an instance of a
class, allow a user to select a .pdf file from the client file system
(using a fileUpload control). On saving the form, I would like to copy
the .pdf file to the server file system to the directory C:\Ensemble
\CSP\app\pdf, and name the file: map_OID.pdf, where OID is the OID of
the object being created and/or edited.

2. From a table pane on a different page, have a link in each row that
would launch that object's saved .pdf in a separate browser window.

I already have the dataController working in the first page, and the
table pane working in the second page.

Any help would be appreciated. Thanks.

Mitch Weyuker

unread,
Nov 13, 2009, 8:23:07 AM11/13/09
to InterSystems: Zen Community
Or is it better to use the binary stream? Any input would be most
appreciated. Thanks.

Neerav Verma

unread,
Nov 13, 2009, 9:30:12 AM11/13/09
to intersys...@googlegroups.com
Hey 

You need to have a class with a property of %GlobalBinaryStream
I know binary stream is the right class but after workign with WRC we figured GlobalBinarystream actually works

About displaying on the page

I know it would be ideal to have it load from the object's stream and display but till now I haven't figured out how to do that. There are some examples but it doesn't work for me and also I haven't put my heart and soul into making it work
So for now I store a copy in the object and one on the hard disk

1. to display you can have a link to the pdf on the server and browsers will open a new window/tab with the pdf in it
2. or you can load the pdf right in the page where you have your form.   i have kept the right side empty and on click the pages display there
But the flip side to it is that this doesn't work on IE but thats ok for us as we are pushing people to use Chrome.
For IE we still have the link which opens the pdf in a separate window

If you want I can send you the sample code . It is pretty complicated.


Thank You,

Neerav Verma
http://www.linkedin.com/in/vneerav
------------------------------------------------------
Charles de Gaulle  - "The better I get to know men, the more I find myself loving dogs."

--
You received this message because you are subscribed to the Google Groups "InterSystems: Zen Community" group.
To post to this group, send email to InterSys...@googlegroups.com
To unsubscribe from this group, send email to InterSystems-Z...@googlegroups.com
For more options, visit this group at http://groups.google.com/group/InterSystems-ZEN?hl=en
Zen Community Terms and Conditions: http://groups.google.com/group/InterSystems-ZEN/web/community-terms-and-conditions

Vlado

unread,
Nov 13, 2009, 10:12:29 AM11/13/09
to InterSystems: Zen Community
Hi Mitch,
Here is some rough code,
which maybe will help you something:
=====================
<html>
<head>

Copy uploaded file and saves it to server
<title> Cache Server Page </title>

</head>

<body bgcolor="#CCCCFF">
<form enctype="multipart/form-data" method="post"
action="fileUpload.csp">
<input type=file size=30 name=FileStream>
<input type="submit" value="Upload file">
</form>
<csp:if condition='($data(%request.MimeData("FileStream",1)))'>
<script language="Cache" runat="server">
Set fileName = ..EscapeHTML(%request.MimeData("FileStream",
1).FileName)
Set ext = $p(fileName,".",$l(fileName,"."))
s newfile=##class(%Stream.FileBinary).%New()
s newfile.Filename= "C:\TEMP\T"_$i(^UNIQUE)_"."_ext
s sc=newfile.CopyFromAndSave(%request.MimeData("FileStream",
1))
s %session.Data("FileName")=newfile.Filename
write "Submitted file: <b>"_ ..EscapeHTML(%request.MimeData
("FileStream",1).FileName)_"</b>"
write "<br/>To file: <b>"_newfile.Filename_"</b>"
</script>
</csp:if>
</body>
</html>
==============================

/// Copy file outside of Cache to another file!!!
Class VICS.FileCopy Extends %ZEN.Component.page
{

/// Class name of application this page belongs to.
Parameter APPLICATION;

/// Displayed name of this page.
Parameter PAGENAME = "FileUpload";

/// Domain used for localization.
Parameter DOMAIN;

/// This XML block defines the contents of this page.
XData Contents [ XMLNamespace = "http://www.intersystems.com/zen" ]
{
<page xmlns="http://www.intersystems.com/zen" title="">
<form id="frmUpload" enctype="multipart/form-data">
<fieldSet legend="File Selection" labelPosition="left">

<text label="File Name:" id="FileName" name="FileName"
dataBinding="FileName" size="60"/>
<text id="wildcard" label="File type wildcard:" value="*"/>
<checkbox id="showdirectoryonly" label="Show directories only:"/>
<button caption="Browse..." onclick="zenPage.showFileSelectionWindow
();"/>

</fieldSet>
<fileUpload id="fileUpload" name="fileUpload" size="100" label="File
to upload: "/>
<submit caption="Upload" action="save" id="Submit"/>
</form>
</page>
}

/// This callback is called when a form on this page is submitted.
/// <var>pSubmit</var> is a <class>%ZEN.Submit</class> object
/// containing details of the form submit.<br>
/// Subclasses override this method.
ClassMethod %OnSubmit(pSubmit As %ZEN.Submit) As %Status
{

set tSC=$$$OK
if (pSubmit.%Action = "save")
{
if (%request.IsDefinedMimeData("$V_fileUpload"))
{
set mimeData = %request.GetMimeData
("$V_fileUpload")
set filename=pSubmit.%GetValue("FileName")
Set file=##class(%File).%New(filename)
Do file.Open("WSN")
do file.CopyFrom(mimeData)
set tSC = file.%Save()
}
}
Quit tSC
}

/// This callback is called at the end of the HTML HEAD section of the
page.<br>
/// (default implementation is a simple expression).
Method %OnDrawHTMLHead() As %Status
{

w "<meta http-equiv=""Content-Type"" content=""text/html;
charset=GB18030"">"
Q $$$OK
}

Method showFileSelectionWindow() [ Language = javascript ]
{
var dir = zenPage.getComponentById("FileName").getValue();
var wildcard = zenPage.getComponentById("wildcard").getValue();
var showdirectoryonly = zenPage.getComponentById
("showdirectoryonly").getValue();
var url = "%ZEN.Dialog.fileSelect.cls?Dir=" + cspEncodeUTF8(dir) +
"&wildcard=" + wildcard;
if (showdirectoryonly) url = url +"&showdirectoryonly=1";
zenLaunchPopupWindow
(url,'FileSelection','status,scrollbars,resizable,width=500,height=700');
}

/// Returning from file select dialog and setting the value into the
FileName field
Method onPopupAction(popupName, action, value) [ Language =
javascript ]
{
if (action == "ok") {
var filename = zenPage.getComponentById("FileName");
filename.setValue(value);
}
}

}

==============================================

/// Import file in Zen Page in iframe
/// File must be in subdirectory of /csp/broker
Class VICS.FileImportToZenPage Extends %ZEN.Component.page
{

Parameter APPLICATION;

Parameter PAGENAME = "File Import to Zen Page";

Parameter DOMAIN;

XData Style
{
<style type="text/css">
</style>
}

/// This XML defines the contents of this page.
XData Contents [ XMLNamespace = "http://www.intersystems.com/zen" ]
{
<page xmlns="http://www.intersystems.com/zen" title="File Import to
Zen Page">
<hgroup>
<vgroup>
<fieldSet legend="File Selection- The File must be in SUBDIRECTORY of
'CSP/broker'" labelPosition="left">
<text label="File Name:" id="FileName" name="FileName" size="60"/>
<text id="wildcard" label="File type wildcard:" value="*"/>
<checkbox id="showdirectoryonly" label="Show directories only:"/>
<button caption="Browse..." onclick="zenPage.showFileSelectionWindow
();"/>
</fieldSet>
</vgroup>

<vgroup valign="top">
<hgroup>
<button id="btnRun" caption="Import File to iFrame1"
onclick="zenPage.getFile();"/>
<spacer width="30px"/>
<button id="btnGet" caption="Copy File to iFrame2"
onclick="zenPage.copyFile();"/>
</hgroup>
</vgroup>
</hgroup>

<hgroup>
<iframe id="iframe1" name="iframe1" label="iframe1"
frameBorder="true" height="250" width="1200"/>
</hgroup>
<hgroup>
<iframe id="iframe2" label="iframe2" frameBorder="true" height="250"
width="1200"/>
</hgroup>

</page>
}

/// The File must be in SUBDIRECTORY of "CSP/broker"
Method getFile() [ Language = javascript ]
{
var filename=zen("FileName").getValue();
if ((filename == null) ||(filename =="")) alert('Please select
file!');
else {
var len=filename.length;
var pos=filename.indexOf("CSP");
var filename1=filename.substring(pos+4,len);
filename1 = filename1.replace(/\\/g,"/");
zenSetProp('iframe1','src',filename1);

}
}

Method copyFile() [ Language = javascript ]
{
var filename=zen("FileName").getValue();
if ((filename == null) ||(filename =="")) alert('Please select
file!');
else {
var src=zen('iframe1').getProperty('src');
zenSetProp('iframe2','src',src);
}
}

/// Demonstration of launching a file selector window.
Method showFileSelectionWindow() [ Language = javascript ]
{
var dir = zenPage.getComponentById("FileName").getValue();
var wildcard = zenPage.getComponentById("wildcard").getValue();
var showdirectoryonly = zenPage.getComponentById
("showdirectoryonly").getValue();
var url = "%ZEN.Dialog.fileSelect.cls?Dir=" + cspEncodeUTF8(dir) +
"&wildcard=" + wildcard;
if (showdirectoryonly) url = url +"&showdirectoryonly=1";
zenLaunchPopupWindow
(url,'FileSelection','status,scrollbars,resizable,width=500,height=700');
}

/// Returning from file select dialog and setting the value into the
FileName field
Method onPopupAction(popupName, action, value) [ Language =
javascript ]
{
if (action == "ok") {
var filename = zenPage.getComponentById("FileName");
filename.setValue(value);
}
}

}

On Nov 13, 6:30 am, Neerav Verma <vnee...@gmail.com> wrote:
> Hey
>
> You need to have a class with a property of %GlobalBinaryStream
> I know binary stream is the right class but after workign with WRC we
> figured GlobalBinarystream actually works
>
> About displaying on the page
>
> I know it would be ideal to have it load from the object's stream and
> display but till now I haven't figured out how to do that. There are some
> examples but it doesn't work for me and also I haven't put my heart and soul
> into making it work
> So for now I store a copy in the object and one on the hard disk
>
> 1. to display you can have a link to the pdf on the server and browsers will
> open a new window/tab with the pdf in it
> 2. or you can load the pdf right in the page where you have your form.   i
> have kept the right side empty and on click the pages display there
> But the flip side to it is that this doesn't work on IE but thats ok for us
> as we are pushing people to use Chrome.
> For IE we still have the link which opens the pdf in a separate window
>
> If you want I can send you the sample code . It is pretty complicated.
>
> Thank You,
>
> Neerav Vermahttp://www.linkedin.com/in/vneerav
> ------------------------------------------------------
> Charles de Gaulle<http://www.brainyquote.com/quotes/authors/c/charles_de_gaulle.html>
> >http://groups.google.com/group/InterSystems-ZEN/web/community-terms-a...

Vlado

unread,
Nov 14, 2009, 7:54:02 PM11/14/09
to InterSystems: Zen Community
Mitch,
Instead of loading the files in Cache database you can leave them
outside
of Cache and manipulate them with their names(paths) instead of OIDs.
Here are two examples which demonstrate this and are more closer
to what you want.They are made for images but the same way you can
use them for any files:

=======================================
Class VICS.EmployeeDemo Extends (%Persistent, %ZEN.DataModel.Adaptor)
{

Property FName As %String [ Required ];

Property LName As %String [ Required ];

Property FileName As %String(MAXLEN = 200);

}
========================================

Class VICS.EmployeePhotoDemo Extends %ZEN.Component.page
{

/// Class Name of application this page belongs to.
Parameter APPLICATION;

/// Displayed Name of this page.
Parameter PAGENAME;

/// Domain used for localization.
Parameter DOMAIN;

XData Style
{
<style type="text/css">
body {
font-family: verdana;
background:#C0C0C0;
}
#table {
width: 700px;
border: 1px solid darkblue;
}
#myForm {
width: 700px;
border: 1px solid black;
background: #404040;
background-image: url(/csp/broker/images/grad-gray-10x500.png);
background-repeat: repeat-x;
}
</style>
}

/// This XML defines the contents of this page.
XData Contents [ XMLNamespace = "http://www.intersystems.com/zen" ]
{
<page xmlns="http://www.intersystems.com/zen" title="Employee Photo
Demo">
<dataController id="source" modelClass="VICS.EmployeeDemo" modelId=""/
>

<vgroup align="center"> <spacer height="10"/>
<tableNavigatorBar showPageSize="true" id="ListBoxNav"
tablePaneId="table"/>
<spacer height="10"/>

<tablePane id="table" maxRows="200" pageSize="5"
caption="Photo Demo"
tableName="VICS.EmployeeDemo"
useSnapshot="true"
showFilters="true"
showZebra="true"
valueColumn="ID"
useKeys="true"
extraColumnWidth="3%"
onselectrow="zenPage.rowSelected(zenThis,which);">
<column colName="ID" width="10%" />
<column colName="FName" header="First Name" width="20%"
filterType="text"/>
<column colName="LName" header="Last Name" width="20%"
filterType="text"/>
<column colName="FileName" header="Photo File Name" width="47%"/>
</tablePane> <spacer height="25"/>

<form id="myForm" controllerId="source" layout="vertical">
<hgroup><spacer width="50px"/>
<vgroup>
<text label="First Name" id="FName" name="FName" dataBinding="FName"
required="true"/>
<text label="Last Name" id="LName" name="LName" dataBinding="LName"
required="true" />
</vgroup><spacer width="50px"/>
<vgroup><spacer height="10px"/>
<image id="image" name="iframe" height="260px" width="360px"
align="left"/>
</vgroup>
</hgroup>
<hgroup> <spacer width="55px"/>

<!-- demonstrate how to use the file selection dialog -->
<fieldSet legend="File Selection" labelPosition="left">
<text label="Photo File Name:" id="FileName" name="FileName"
dataBinding="FileName" size="60"/>
<text id="wildcard" label="File type wildcard:" value="*"/>
<checkbox id="showdirectoryonly" label="Show directories only:"/>
<button caption="Browse..." onclick="zenPage.showFileSelectionWindow
();"/>
</fieldSet>
</hgroup> <spacer height="10px"/>

<hgroup> <spacer width="255px"/>
<button caption="New" onclick="zenPage.newItem();" />
<spacer width="10px"/>
<button caption="Save" onclick="zenPage.saveItem();" />
<spacer width="10px"/>
<button caption="Cancel" onclick="zenPage.cancel();" />
<spacer width="10px"/>
<button caption="Delete" onclick="zenPage.deleteItem();" />
</hgroup>

</form>
<spacer height="25"/>
<hgroup>
<spacer width="100"/>
</hgroup>
</vgroup>
</page>
}

/// Row in Master table select; update controller.
/// <var>which</var> indicates how this event was fired.
Method rowSelected(table, which) [ Language = javascript ]
{
if ('keypress' == which) {
// defer this action in case the user is arrowing through a number
of items
var id = table.getValue();
var action = new Function("zenPage.getComponentById
('source').setProperty('modelId','"+id+"');");
zenSetDeferredAction(action,200);
}
else {
// select immediately
var id = table.getValue();
zen('source').setProperty('modelId',id);
this.showPhoto();

}
}

Method showPhoto() [ Language = javascript ]
{
var filename=zen('FileName').getValue();
var image=zen('image');

if (filename==undefined || filename==""){image.setProperty
('src','about:blank');}
else image.setProperty('src','csp/broker/photos/'+filename);
}

Method newItem() [ Language = javascript ]
{
zen('image').setProperty('src','about:blank');
zen('table').selectRow(-1);
zen('source').createNewObject();
}

/// save form to database
Method saveItem() [ Language = javascript ]
{
zen("myForm").save();
zen('table').executeQuery();
}

/// cancel the current action
Method cancel() [ Language = javascript ]
{
zen('myForm').reset();
zen('table').selectRow(-1);
zen('source').setProperty('modelId','');

zen('image').setProperty('src','csp/broker/images/einstein.jpg');
//zen('image').setProperty('src','about:blank');
}

/// Delete current item from database
Method deleteItem() [ Language = javascript ]
{
var controller = zen('source');
var id = controller.getModelId();

if ('' == id) {
alert('Nothing is selected from the Table!');
}
else if (confirm('Are you sure?')){
controller.deleteId(id);

zen('myForm').reset();
zen('table').executeQuery();
}
}

/// Demonstration of launching a file selector window.
Method showFileSelectionWindow() [ Language = javascript ]
{
var dir = zenPage.getComponentById("FileName").getValue();
var wildcard = zenPage.getComponentById("wildcard").getValue();
var showdirectoryonly = zenPage.getComponentById
("showdirectoryonly").getValue();
var url = "%ZEN.Dialog.fileSelect.cls?dir=" + cspEncodeUTF8(dir) +
"&wildcard=" + wildcard;
if (showdirectoryonly) url = url +"&showdirectoryonly=1";
zenLaunchPopupWindow
(url,'FileSelection','status,scrollbars,resizable,width=500,height=700');
}

/// Returning from file select dialog and setting the value into the
FileName field
Method onPopupAction(popupName, action, value) [ Language =
javascript ]
{
if (action == "ok") {

var filename = value
var pos=filename.lastIndexOf('\\');
var filename=filename.substring(pos+1,filename.length);

var controller = zen('source');
controller.setDataByName('FileName',filename)
zen('FileName').setValue(filename);
this.showPhoto();
}
}

}
====================================

Class VICS.EmployeePhotoDemoPR Extends %ZEN.Component.page
{

/// Class Name of application this page belongs to.
Parameter APPLICATION;

/// Displayed Name of this page.
Parameter PAGENAME;

/// Domain used for localization.
Parameter DOMAIN;

Property Link As %Boolean [ InitialExpression = 0 ];

XData Style
{
<style type="text/css">
body {
font-family: verdana;
background:#C0C0C0;
}
#table {
width: 700px;
border: 1px solid darkblue;
}
</style>
}

/// This XML defines the contents of this page.
XData Contents [ XMLNamespace = "http://www.intersystems.com/zen" ]
{
<page xmlns="http://www.intersystems.com/zen" title="Employee Photo
Demo">
<dataController id="source" modelClass="VICS.EmployeeDemo" modelId=""/
>

<vgroup align="center"> <spacer height="10"/>
<tableNavigatorBar showPageSize="true" id="ListBoxNav"
tablePaneId="table"/>
<spacer height="10"/>

<tablePane id="table" maxRows="200" pageSize="10"
caption="Photo Demo"
tableName="VICS.EmployeeDemo"
useSnapshot="true"
showFilters="true"
showZebra="true"
valueColumn="ID"
useKeys="true"
extraColumnWidth="3%"
onselectrow="zenPage.rowSelected(zenThis,which);">
<column colName="ID" width="10%" />
<column colName="FName" header="First Name" width="20%"
filterType="text"/>
<column colName="LName" header="Last Name" width="20%"
filterType="text"/>
<column colName="FileName" header="Photo File Name" width="27%"
hidden="true"/>
<column link="" onclick="zenPage.showFile('#(%query.FileName)#')"
linkCaption="Show file"/>
</tablePane>


<image id="iframe" name="iframe" height="260px" width="360px"
align="left"/>
</vgroup>
</page>
}

/// Row in Master table select; update controller.
/// <var>which</var> indicates how this event was fired.
Method rowSelected(table, which) [ Language = javascript ]
{

if (this.Link==true) {
this.Link=false;
return;
}
else {
this.Link=false


if ('keypress' == which) {
// defer this action in case the user is arrowing through a number
of items
var id = table.getValue();
var action = new Function("zenPage.getComponentById
('source').setProperty('modelId','"+id+"');");
zenSetDeferredAction(action,200);
}
else {
// select immediately
var id = table.getValue();
zen('source').setProperty('modelId',id);
}
}
}
Method showFile(filename) [ Language = javascript ]
{
this.Link=true;
var iframe=zen('iframe');

if (filename==undefined || filename==""){iframe.setProperty
('src','about:blank');}
else iframe.setProperty('src','csp/broker/photos/'+filename);
> ...
>
> read more »

Neerav Verma

unread,
Nov 16, 2009, 10:35:42 AM11/16/09
to intersys...@googlegroups.com
I see Vlado sent you the code. I am sure his code would work as it always does
If still you need anything from me, pls let me know


Thank You,

Neerav Verma
http://www.linkedin.com/in/vneerav
------------------------------------------------------
Samuel Goldwyn  - "I'm willing to admit that I may not always be right, but I am never wrong."

To post to this group, send email to InterSys...@googlegroups.com

To unsubscribe from this group, send email to InterSystems-Z...@googlegroups.com
For more options, visit this group at http://groups.google.com/group/InterSystems-ZEN?hl=en
Reply all
Reply to author
Forward
0 new messages