Show Banner Message

Summary

SigmaSDK.WRITER.showBannerMessage() displays a lightweight, non-blocking banner notification in the Zoho Writer interface. The banner auto-dismisses and does not interrupt the user's workflow.

Purpose

  • Show non-blocking status updates to the user
  • Notify the user of background operation progress
  • Display lightweight feedback without interrupting workflow
  • Show save confirmations or brief alerts

Syntax

SigmaSDK.WRITER.showBannerMessage({
    type: "success" | "error" | "info" | "warning",
    message: "Message text"
})

Parameters

ParameterTypeRequiredDescription
typeStringYesMessage type: "success", "error", "info", or "warning"
messageStringYesThe notification message text

Complete Example

<!DOCTYPE html>
<html>
<head>
    <title>Banner Message Widget</title>
    <script src="https://static.zohocdn.com/sigma/client/sdk/v3/sigma-sdk.min.js"></script>
    <style>
        body { font-family: Arial, sans-serif; padding: 20px; }
        button { padding: 10px 20px; margin: 5px; cursor: pointer; }
    </style>
</head>
<body>
    <h1>Banner Message Demo</h1>
    <button onclick="showSuccess()">Show Success</button>
    <button onclick="showError()">Show Error</button>
    <button onclick="showInfo()">Show Info</button>
    <button onclick="showWarning()">Show Warning</button>
    <button onclick="runOperation()">Run Operation</button>

    <script>
        SigmaSDK.WRITER.init();

        function showSuccess() {
            SigmaSDK.WRITER.showBannerMessage({
                type: "success",
                message: "Settings saved successfully!"
            });
        }

        function showError() {
            SigmaSDK.WRITER.showBannerMessage({
                type: "error",
                message: "Failed to connect. Check your network."
            });
        }

        function showInfo() {
            SigmaSDK.WRITER.showBannerMessage({
                type: "info",
                message: "Loading document data..."
            });
        }

        function showWarning() {
            SigmaSDK.WRITER.showBannerMessage({
                type: "warning",
                message: "API rate limit approaching."
            });
        }

        async function runOperation() {
            SigmaSDK.WRITER.showBannerMessage({ type: "info", message: "Processing..." });
            try {
                // await someApiCall();
                SigmaSDK.WRITER.showBannerMessage({ type: "success", message: "Done!" });
            } catch (error) {
                SigmaSDK.WRITER.showBannerMessage({ type: "error", message: "Operation failed." });
            }
        }
    </script>
</body>
</html>

Real-World Scenarios

After Saving Data

async function saveData(data) {
    await SigmaSDK.WRITER.storage.document.add({ key: "data", value: JSON.stringify(data) });
    SigmaSDK.WRITER.showBannerMessage({ type: "success", message: "Data saved." });
}

After API Call

async function fetchFromAPI() {
    SigmaSDK.WRITER.showBannerMessage({ type: "info", message: "Fetching data..." });
    try {
        const response = await SigmaSDK.WRITER.request({ ... });
        SigmaSDK.WRITER.showBannerMessage({ type: "success", message: "Data loaded!" });
    } catch (error) {
        SigmaSDK.WRITER.showBannerMessage({ type: "error", message: "Fetch failed." });
    }
}

Related Pages