Actions
share
8 min
easily share your files directly from the app with just a tap whether it's a document, image, or report, the share action lets you quickly send files via apps on the device, such as email, messaging apps, or airdrop configuration options some properties are common to all components, see common component properties docid\ llntd rxe8fmh7wpc5czb for a list and their configuration options core structure email provide an email address, this optional property allows a string or expression it is used to set the to address if sharing with email if an email is supplied the share action will automatically open up the default email app on the phone to compose and fill in the supplied details if email is not supplied, you will be able to share via other methods or apps for ios you can only supply a single email address if you supply more, the to field will be left blank this is not an issue on android but for consistency it is best to keep to one email address fileuri provide the uri for the file you want to share, either from a datasource, in an expression, or from an action, such as the action generate pdf you can reference the pdf or the local uri of the pdf document using the action's output uri =@ctx actions generatepdf outputs uri the fileuri needs to be the full uri of the local file message add a text message to send with the shared file subject add a subject when sharing the file the subject will only appear in apps that support a subject property, such as email title provide the action button with a title, for example, share file considerations all properties are optional but you need to at least supply a message or fileuri you can select from the apps or methods available on your device for sharing this means you can share a piece of text without a file you can also share one or more files if there is more than one file it needs to evaluate to a string array for best results, share files that are stored locally (e g , images or pdfs) files stored in a datasource as base64, data uri, or buffers will be returned as unreadable binary ( bin) files examples and code snippets share images in this example, a foreman takes multiple images of the job and saves the images to dynamic data when the images are successfully saved the images are shared via the devices message sharing apps action share images jigx title site inspection type jig default icon building 1 building header type component jig header options height medium children type component image options source uri https //images unsplash com/photo 1541888946425 d81bb19240f5?w=900\&auto=format\&fit=crop\&q=60\&ixlib=rb 4 0 3\&ixid=m3wxmja3fdb8mhxzzwfyy2h8m3x8ynvpbgrpbmclmjbjb25zdhj1y3rpb258zw58mhx8mhx8fda%3d children \ type component form instanceid site multiple options isdiscardchangesalertenabled false children \ type component media field instanceid site photos options \# set media field to allow multiple image uploads ismultiple true label capture images from the site mediatype image \# include the save method and share actions in the action list actions \ children \ type action action list options title save & share photos issequential true actions \# configure the action to save the images to the database \ type action execute entity options provider data provider dynamic entity default/site method create data \# provide the metadata and image files to be saved site photos =@ctx components site photos state value createdby =@ctx user email createddate =$now() onsuccess \# once saved, the device's apps modal opens to send the images type action share options message =$frommillis($tomillis($now()), '\[m]/\[d]/\[y]') site photos fileuri =@ctx components site photos state value generate a pdf, save and share in this example, an action list contains three actions the first generates a pdf for an invoice, the second saves it to the database, and the third shares the pdf via a messaging app on the device when saving the file to the database the file is converted from local uri to data uri for storage action generate pdf save share jigx title monthly invoicing description provide you details type jig default header type component jig header options height small children type component image options source uri https //images unsplash com/photo 1450101499163 c8848c66ca85?w=900\&auto=format\&fit=crop\&q=60\&ixlib=rb 4 0 3\&ixid=m3wxmja3fdb8mhxzzwfyy2h8mtr8fgludm9py2luz3xlbnwwfhwwfhx8ma%3d%3d children \ type component section options title details children \ type component form instanceid inputvalues options children \ type component text field instanceid firstname options initialvalue john smith label first name isrequired false \ type component email field instanceid email options initialvalue john smith\@global com label email address \ type component number field instanceid phonenumber options initialvalue 23445634556 label mobile number \# create an action list that will first create the pdf from the html, \# secondly save the pdf file to the dynamic database, \# thirdly share the pdf file via one of the devices apps actions \ children \ type action action list options title send invoice issequential true actions \# first action to generate the pdf \ type action generate pdf instanceid generate pdf id options \# provide the html for the pdf file html =@ctx datasources invoice html invoice \# give the pdf a name that is used when saved or shared filename invoice 1 \# second action to save the file to the dynamic database \ type action execute entity options provider data provider dynamic entity default/documents method create data \# enter the file name for database storage filename invoice 1 date =$now() \# use the action instance output to reference the file file =@ctx actions generate pdf id outputs uri \# convert the file from local uri to data uri for database storage conversions \ property file from local uri to data uri \# third action to share the file via the device's apps \ type action share options \# use the action instance output to reference the file fileuri =@ctx actions generate pdf id outputs uri \# provide a message and subject to accompany the share message global invoice \# subject appears only in apps that support it (e g , email) subject invoice for january invoice html datasource type datasource static options data \ id 1 invoice | \<!doctype html> \<html lang="en"> \<head> \<meta charset="utf 8"> \<meta name="viewport" content="width=device width, initial scale=1 0"> \<title>invoice\</title> \<style> body { font family 'arial', sans serif; margin 0; padding 20px; background color #f6f6f6; } invoice box { max width 800px; margin auto; padding 30px; border 1px solid #eee; box shadow 0 0 10px rgba(0, 0, 0, 0 15); background color #fff; color #555; } invoice box table { width 100%; line height 1 6; text align left; border collapse collapse; } invoice box table td { padding 5px; vertical align top; } invoice box table tr td\ nth child(2) { text align right; } invoice box table tr top table td { padding bottom 20px; } invoice box table tr information table td { padding bottom 40px; } invoice box table tr heading td { background #eee; border bottom 1px solid #ddd; font weight bold; } invoice box table tr details td { padding bottom 20px; } invoice box table tr item td { border bottom 1px solid #eee; } invoice box table tr item last td { border bottom none; } invoice box table tr total td\ nth child(2) { border top 2px solid #eee; font weight bold; } h2, h3 { margin 0; } \</style> \</head> \<body> \<div class="invoice box"> \<table cellpadding="0" cellspacing="0"> \<! invoice header > \<tr class="top"> \<td colspan="2"> \<table> \<tr> \<td class="title"> \<h2>company name\</h2> \</td> \<td> invoice # 12345\<br> created january 1, 2025\<br> due january 31, 2025 \</td> \</tr> \</table> \</td> \</tr> \<! company & customer information > \<tr class="information"> \<td colspan="2"> \<table> \<tr> \<td> company name, inc \<br> 12345 street address\<br> city, state, zip \</td> \<td> customer name\<br> customer company\<br> 67890 customer address \</td> \</tr> \</table> \</td> \</tr> \<! payment method details > \<tr class="heading"> \<td>payment method\</td> \<td>check #\</td> \</tr> \<tr class="details"> \<td>check\</td> \<td>1001\</td> \</tr> \<! itemized list of services/products > \<tr class="heading"> \<td>item\</td> \<td>price\</td> \</tr> \<tr class="item"> \<td>website design\</td> \<td>$300 00\</td> \</tr> \<tr class="item"> \<td>hosting (3 months)\</td> \<td>$75 00\</td> \</tr> \<tr class="item last"> \<td>domain registration (1 year)\</td> \<td>$10 00\</td> \</tr> \<! total > \<tr class="total"> \<td>\</td> \<td>total $385 00\</td> \</tr> \</table> \</div> \</body> \</html> share by email share by email in this example, we demonstrate using the action share to send an email to a customer with an attachment the message , subject and email (to) properties are configured as part of the action for best results, share files that are stored locally (e g , images or pdfs) files stored in a datasource as base64, data uri, or buffers will be returned as unreadable binary ( bin) files action share email jigx title global invoice type jig document icon accounting invoice \# the datasource returns the pdf file that will be sent datasources storage type datasource sqlite options provider data provider dynamic entities \ default/documents query | select id, '$ filename', '$ date', '$ html', '$ file' from \[default/documents] where '$ filename' = "purchase order" source documenttype html content =@ctx datasources purchase order html order actions \ children \# add the share action, and configure the email details \ type action share options \# the title will display on the action button title send order \# add the email address which populates the to field in an email \# for ios you can only supply a single email address \# if you supply more, the to field will be left blank \# this is not an issue on android, \# but for consistency it is best to keep to one email address email john\@gobal com \# specify the file that will be shared as an attachment to the email fileuri =@ctx datasources storage file \# provide a message which populates the body of the email message hi john, attached is your purchase order \# provide a subject for the email's subject line subject purchase order march 2025 purchase order html datasource type datasource static options data \ id 1 order | \<!doctype html> \<html lang="en"> \<head> \<meta charset="utf 8"> \<meta name="viewport" content="width=device width, initial scale=1 0"> \<title>purchase order\</title> \<style> body { font family arial, sans serif; margin 20px; padding 20px; background color #f4f4f4; } purchase order { background #fff; padding 20px; border radius 5px; box shadow 0 0 10px rgba(0, 0, 0, 0 1); max width 600px; margin auto; } h2 { text align center; } table { width 100%; border collapse collapse; margin top 10px; } table, th, td { border 1px solid #000; } th, td { padding 8px; text align left; } footer { margin top 20px; text align center; } \</style> \</head> \<body> \<div class="purchase order"> \<h2>purchase order\</h2> \<p>\<strong>order number \</strong> po12345\</p> \<p>\<strong>date \</strong> february 13, 2025\</p> \<p>\<strong>supplier \</strong> abc supplies ltd \</p> \<table> \<tr> \<th>item\</th> \<th>quantity\</th> \<th>price\</th> \</tr> \<tr> \<td>concrete blocks\</td> \<td>100\</td> \<td>$500\</td> \</tr> \<tr> \<td>steel rods\</td> \<td>50\</td> \<td>$750\</td> \</tr> \<tr> \<td>cement bags\</td> \<td>20\</td> \<td>$200\</td> \</tr> \</table> \<p>\<strong>total amount \</strong> $1450\</p> \<div class="footer"> \<p>authorized by \</p> \</div> \</div> \</body> \</html>