Custom Buttons

With "Custom Buttons," you can add user-defined actions to your tables. These actions can either call a URL (e.g., to start an external service) or execute a client-side JavaScript function.

Configuration

• Name: The text displayed on the button.
• Icon: A FontAwesome icon for the button (e.g., fa-rocket).
• Color: The color of the button (e.g., Primary, Success, Danger).
• URL / Script: The action to be executed.
• Display Context: Determines where the button appears (List View, Record View, etc.).
• Conditional Display: Shows the button only if a specific condition in the record is met (only in record view).

URL Actions

You can use placeholders to insert values from the current record into the URL:

• {record_id}: Is replaced by the ID of the record.
• {field:technical_name}: Is replaced by the value of the corresponding field.

Example: https://my-api.com/update?id={record_id}&status=new&value={field:amount}

JavaScript Actions

To call a JavaScript function, prefix the call with javascript:. You can also use placeholders here.

Example: javascript:template_gmaps({record_id}, 'data_team_myteam_1')

Example Script 1: Google Maps Integration (template_gmaps.js)

This script searches for address fields in the record and opens the address in Google Maps.

/**
 * Opens the address of a record in Google Maps.
 * @param {number} recordId The ID of the record.
 * @param {string} tableName The technical name of the table.
 */
async function template_gmaps(recordId, tableName) {
    try {
        // Fetch record from the server
        const response = await fetch(`api/v1.php?action=get_record&table=${tableName}&id=${recordId}`);
        const result = await response.json();

        if (!result.success) throw new Error(result.message);

        const record = result.data;
        const addressParts = [];

        // Search for typical address fields and assemble them
        const fieldKeys = ['street', 'house_number', 'zip_code', 'city', 'address'];
        for (const key of fieldKeys) {
            if (record[key]) {
                addressParts.push(record[key]);
            }
        }

        if (addressParts.length === 0) {
            showToast('Error', 'No suitable address field (e.g., "address", "street") could be found in the record.', 'error');
            return;
        }

        const fullAddress = addressParts.join(', ');
        const url = `https://www.google.com/maps?q=${encodeURIComponent(fullAddress)}`;

        // Open in a new tab
        window.open(url, '_blank');

    } catch (error) {
        console.error('Error in template_gmaps:', error);
        showToast('Error', 'The address could not be retrieved or opened.', 'error');
    }
}