How to Dynamically Sort Table Visualization Data Using URL Parameters in Helical Insight

Adhoc
, , , ,
#1

Hello Team,

We are using open source BI Helical Insight 6.2.0.952 GA. How can we dynamically sort Table Visualization data in Helical Insight using URL parameters? The reports we are creating are created using the drag drop interface.

We have a requirement where users should be able to control:

Sorting column

Sorting direction (ASC/DESC)

directly from the report URL without modifying the visualization manually.

Example URL:

https://216.48.177.235:8443/bi-ee/#/report-viewer?dir=OptCulture&file=Report_WIth_Security.hr&mode=open&sort_column=employee_name_myRename&sort_condition=asc

We want the table visualization to automatically apply sorting based on:

sort_column

sort_condition

passed dynamically through the URL.

Thanks,
Snow.

#2

Hello Snow,

Yes, this can be achieved using JavaScript in the Operations section. Go to Visualization → Operations → Post Execution section.

image

The script reads URL parameters dynamically and applies orderBy to the matching field.

Sample Script

var tempBaseUrl = new URLSearchParams(window.location.href.split('?')[1])

var sortColumn = tempBaseUrl.get('sort_column');
var sortCond = tempBaseUrl.get('sort_condition');

if (sortCond) {
    sortCond = sortCond.replace(/['"]/g, '').toLowerCase();
}

if (!['asc', 'desc'].includes(sortCond)) {
    sortCond = 'asc';
}

if (sortColumn != null && sortColumn.trim() !== '') {

    if (properties.table.hasOwnProperty(sortColumn)) {
        if (!properties.table[sortColumn].includes('sort')) {
            properties.table[sortColumn].push('sort');
        }
    }

    fields.map(item => {

        if (item.hasOwnProperty('alias')) {

            if (item.alias == sortColumn) {
                item.orderBy = [sortCond]
            } else {
                if (item.autogen_alias == sortColumn) {
                    item.orderBy = [sortCond]
                }
            }

        } else {

            if (item.autogen_alias == sortColumn) {
                item.orderBy = [sortCond]
            }

        }

    })
}

image

Thank You,
Helical Insight.