How to Add a CSV Export Button with Custom Encoding to Your Cloud Application

Exporting data to a CSV (Comma-Separated Values) file is a must-have feature in modern applications, offering users a simple way to extract and use data in tools like Excel or other systems. In cloud-based applications, where server-side file access is restricted, this task requires a slightly different approach than traditional setups. In this post, I’ll show you how to add an “Export CSV” button to a form, exporting fields like product IDs, names, descriptions, and quantities into a CSV file with proper line breaks and custom encoding. We’ll use AL (a modern development language) with cloud-friendly techniques as an example. Let’s dive in!

The Goal

Imagine a form in your cloud application displaying a list of items—perhaps an order or inventory screen. You want an “Export CSV” button that generates a downloadable CSV file with these fields:

Product ID: A unique identifier for each item.

  • Name: The item’s title or label.
  • Details: A detailed description.
  • Count: The quantity of items.

Since this is a cloud app, the file can’t be saved directly to a server folder. Instead, it’ll be streamed to the user for download, using UTF-8 encoding to handle special characters like ä, £, or ₹.

Step-by-Step Implementation

1. Adding the Action Button

Extend your form with a new action button:

  • Name it “Export CSV” for clarity.
  • Place it in a user-friendly spot, like an “Actions” area.
  • Tie it to a function that kicks off the export process.

Add a visual touch—maybe an export icon—and make it prominent for easy access.

2. Gathering the Data

When the button is clicked, collect the data to export. Assume the form shows items with fields like a product ID, name, and count, with details pulled from a related source (e.g., a product catalog). Here’s the process:

  • Filter the list to the current context (e.g., items in an order).
  • For each item:
    • Map “Product ID” to the identifier.
    • Map “Name” to the title.
    • Fetch “Details” from the related source.
    • Map “Count” to the quantity.

3. Building the CSV Content

Construct the CSV as a text string:

  • Header Row: Start with “product_id”,”name”,”details”,”count”.
  • Data Rows: Add rows for each item, quoting fields (e.g., “P001″,”Green Lamp”,”Eco-friendly LED lamp”,”8″).
  • Line Breaks: Use a modern newline function (e.g., Environment.NewLine) for clean, platform-appropriate line endings.

4. Streaming the File with Encoding

In a cloud environment, you can’t write to a server disk. Instead, store the CSV in a temporary buffer and stream it to the user:

  • Use a temporary blob (binary large object) to hold the CSV content.
  • Set the encoding (e.g., UTF-8) when writing to the blob.
  • Trigger a download, letting the user save the file locally.

Here’s an AL example for a cloud application:

procedure ExportToCSV()
var
ItemList: Record “Item”; // Placeholder for your data source
Product: Record “Product”; // Placeholder for related details
CSVText: Text;
LineText: Text;
TempBlob: Codeunit “Temp Blob”;
OutStr: OutStream;
InStr: InStream;
FileName: Text;
begin
// Define filename for download
FileName := ‘Items_’ + Format(Today, 0, ‘<Year4><Month02><Day02>’) + ‘.csv’;

// Build CSV header
CSVText := ‘”product_id”,”name”,”details”,”count”‘;
CSVText += Environment.NewLine; // Cloud-friendly line break

// Simulate fetching data (replace with your data source)
ItemList.FindSet();
repeat
LineText := ”;
LineText += ‘”‘ + ItemList.”No.” + ‘”‘; // Product ID
LineText += ‘,”‘ + ItemList.Description + ‘”‘; // Name
if Product.Get(ItemList.”No.”) then
LineText += ‘,”‘ + Product.”Detailed Description” + ‘”‘; // Details
else
LineText += ‘,””‘;
LineText += ‘,”‘ + Format(ItemList.”Quantity Available”) + ‘”‘; // Count
CSVText += LineText + Environment.NewLine;
until ItemList.Next() = 0;

// Write to temporary blob with UTF-8 encoding
TempBlob.CreateOutStream(OutStr, TextEncoding::UTF8);
OutStr.WriteText(CSVText);
TempBlob.CreateInStream(InStr);

// Trigger download
DownloadFromStream(InStr, ‘Export CSV’, ”, ‘CSV Files (*.csv)|*.csv’, FileName);
Message(‘CSV file downloaded as %1’, FileName);
end;