Forum Discussion

Astroraf's avatar
Astroraf
Data Pipeline
10-24-2025
Solved

How to make Switchable Dimension with Radio Buttons

Hi harikm007​ DRay​  I am trying to create a radio button switcable dimensional changer and wanted to see if it can be done with Radio Buttons, my current script is: { "title": "", "styl...
Blox
Customizations
dashboard design
  • harikm007's avatar
    harikm007
    10-28-2025

    Hi Astroraf​ ,

    Hope the script below works for you!

    Blox script:

    {
    "title": "",
    "style": "",
    "script": "",
    "showCarousel": true,
    "body": [
        {
            "type": "Container",
            "class": "radiotval-dimswitch",
            "items": [
                {
                    "type": "Input.ChoiceSet",
                    "id": "radiotVal",
                    "displayType": "expanded",
                    "choices": [
                        {
                            "title": "Total Revenue",
                            "value": "0"
                        },
                        {
                            "title": "Total Quantity",
                            "value": "1"
                        }
                    ]
                }
            ]
        }
    ],
    "actions": []
}

     

    Also add below widget script to the blox widget.  Here add ids of target widgets to widgetids array.

    widget.on('domready',function(widget, args){
	widgetIds = ['68ffba3fa3420a7cd45d34feb', '68ffba47aa380a7cd27d34fed'];
	
	const radios = document.querySelectorAll('.radiotval-dimswitch input');
	
	refWidget = prism.activeDashboard.widgets.$$widgets.find(w => w.oid === widgetIds[0]);
	if (refWidget.metadata.panels[1].$$widget.type == 'indicator') {
		defaultPanel = refWidget.metadata.panels[0].items[0].jaql.title;
	}
	else {
		defaultPanel = refWidget.metadata.panels[1].items[0].jaql.title;
	}
	
	
	defaultMeasureIndex = widget.metadata.panels[1].items.findIndex(i=>i.jaql.title === defaultPanel);
	radios.forEach(radio => {
		radio.checked = (radio.value == defaultMeasureIndex);
	});
	
	
	radios.forEach(r => r.addEventListener('change', e => {		
		dimToSwapTo = widget.metadata.panels[1].items[event.target.value].jaql;
		switchMeasure(dimToSwapTo)
		
	}));
		
})

function switchMeasure(dimToSwapTo){
	prism.activeDashboard.widgets.$$widgets
		.filter(i => widgetIds.includes(i.oid))
		.forEach(function (widget) {
			if (widget.metadata.panels[1].$$widget.type == 'indicator') {
				widget.metadata.panels[0].items[0].jaql = dimToSwapTo;
			}
			else {
				widget.metadata.panels[1].items[0].jaql = dimToSwapTo;
			}

			widget.changesMade('plugin-BloX', 'metadata');
			widget.refresh();
	})
}

     

    Result:

     

    Please let me know if you have any questions

    -Hari

    https://www.binextlevel.com/ 

Astroraf's avatar
Astroraf
Data Pipeline
10-31-2025

Hey harikm007​ ,

Do the widget edit script work for Items as well or just Values and if it jsut works for Values in the BloX is there a way to make it work for Items in Sisense?

harikm007's avatar
harikm007
Data Warehouse
11-05-2025

Yes, that's possible.

I made some changes in the widget script.

widget.on('domready',function(widget, args){
	widgetIds = ['68ffba4ca380a7cd27d34fed'];
	
	const radios = document.querySelectorAll('.radiotval-dimswitch input');
	
	refWidget = prism.activeDashboard.widgets.$$widgets.find(w => w.oid === widgetIds[0]);

	defaultPanel = refWidget.metadata.panels[0].items[0].jaql.title;
		
	defaultMeasureIndex = widget.metadata.panels[0].items.findIndex(i=>i.jaql.title === defaultPanel);
	radios.forEach(radio => {
		radio.checked = (radio.value == defaultMeasureIndex);
	});
	
	
	radios.forEach(r => r.addEventListener('change', e => {		
		dimToSwapTo = widget.metadata.panels[0].items[event.target.value].jaql;
		switchMeasure(dimToSwapTo)
		
	}));
		
})

function switchMeasure(dimToSwapTo){
	prism.activeDashboard.widgets.$$widgets
		.filter(i => widgetIds.includes(i.oid))
		.forEach(function (widget) {
			
			widget.metadata.panels[0].items[0].jaql = dimToSwapTo;
			
			widget.changesMade('plugin-BloX', 'metadata');
			widget.refresh();
	})
}

Also updated little bit in Blox script:

{
    "title": "",
    "style": "",
    "script": "",
    "showCarousel": true,
    "carouselAnimation": {
        "delay": 0,
        "showButtons": false
    },
    "body": [
        {
            "type": "Container",
            "class": "radiotval-dimswitch",
            "items": [
                {
                    "type": "Input.ChoiceSet",
                    "id": "radiotVal",
                    "displayType": "expanded",
                    "choices": [
                        {
                            "title": "Category",
                            "value": "0"
                        },
                        {
                            "title": "Status",
                            "value": "1"
                        }
                    ]
                }
            ]
        }
    ],
    "actions": []
}

-Hari