topic How to create a interactive HTML with two tabs which change the chart image in one based on the value choosen in dropdown list in Discussions

How to create a interactive HTML with two tabs which change the chart image in one based on the value choosen in dropdown list

anandambujaraja — Fri, 12 Sep 2025 07:44:09 GMT

rpt = New Window("Image Gallery Report",

TabBox("Overlay Maps",

H List Box(

row1_hlist = V List Box(Text Box("Image Gallery from: " || "INTW.203P"),

//Text Box("Found " || Char(N Items(image_files)) || " images"),

Spacer Box(Size(0, 10))),

Spacer Box(Size(0, 20)),

// Second row label

row2_hlist = V List Box(Text Box("Image Gallery from: " || "INTW.103P"),

//Text Box("Found " || Char(N Items(image_files)) || " images"),

Spacer Box(Size(0, 10))),

Spacer Box(Size(0, 20))

"Indiviudal",

H List Box(

// Second row label

row3_hlist = V List Box(Text Box("DROPDOWN "),

//Text Box("Found " || Char(N Items(image_files)) || " images"),

myListbox = ComboBox(Lot_List, doListChoice),

doListChoice = expr(

choice = myListbox << getSelected;

show(choice););

Spacer Box(Size(0, 10)),

report_conatiner = v list box()

Spacer Box(Size(0, 20)),

// Second row label

row5_hlist = V List Box(Text Box("Image Gallery from: " || "INTW.103P")

//Text Box("Found " || Char(N Items(image_files)) || " images"),

)

);

I have got the report from above script but its not interactive and I am getting access error on report conatiner. Could you please help

rpt = New Window("Image Gallery Report",
	Tab Box(
		"Overlay Maps",
		H List Box(
			row1_hlist = V List Box(
				Text Box("Image Gallery from: " || "INTW.203P"), 
        //Text Box("Found " || Char(N Items(image_files)) || " images"),
				Spacer Box(Size(0, 10))
			),
			Spacer Box(Size(0, 20)), 
        // Second row label  
			row2_hlist = V List Box(
				Text Box("Image Gallery from: " || "INTW.103P"), 
        //Text Box("Found " || Char(N Items(image_files)) || " images"),
				Spacer Box(Size(0, 10))
			),
			Spacer Box(Size(0, 20))
		),
		"Indiviudal",
		H List Box(
         // Second row label  
			row3_hlist = V List Box(
				Text Box("DROPDOWN "), 
        //Text Box("Found " || Char(N Items(image_files)) || " images"),
				myListbox = Combo Box(Lot_List, doListChoice),
				doListChoice = Expr(
					choice = myListbox << getSelected;
					Show(choice);
				);
				Spacer Box(Size(0, 10));,
				report_conatiner = V List Box()
			),
			Spacer Box(Size(0, 20)), 
        
        // Second row label  
			row5_hlist = V List Box(
				Text Box("Image Gallery from: " || "INTW.103P")
        //Text Box("Found " || Char(N Items(image_files)) || " images"),
			)
		)
	),

);

Edit (jthi): added JSL formatting and removed some unnecessary whitespace

Re: How to create a interactive HTML with two tabs which change the chart image in one based on the value choosen in dropdown list

anandambujaraja — Fri, 12 Sep 2025 07:37:31 GMT

One more issue on the above script is in JSL report tab is creating but not in HTML report with below code

rpt << Save HTML("BSS.HTML", "BSS Report");

Re: How to create a interactive HTML with two tabs which change the chart image in one based on the value choosen in dropdown list

jthi — Fri, 12 Sep 2025 07:45:55 GMT

Not all the features work within interactive html and you might have to use different structure.

Re: How to create a interactive HTML with two tabs which change the chart image in one based on the value choosen in dropdown list

hogi — Fri, 12 Sep 2025 08:44:58 GMT

Interactive Tabbed reports in 5 seconds - without issues?
-> use Application Builder

by @DonMcCormack

Re: How to create a interactive HTML with two tabs which change the chart image in one based on the value choosen in dropdown list

anandambujaraja — Fri, 12 Sep 2025 16:27:17 GMT

Thanks Jarmo. Is it possible to create HTML report with dropdown box and change graph based on value chosen from dropdown box?

Re: How to create a interactive HTML with two tabs which change the chart image in one based on the value choosen in dropdown list

hogi — Sat, 13 Sep 2025 08:06:09 GMT

To get a Dropdown menu instead of Tabs, you can change the "Style" to "Combo":

edit:

but the exported HTML file doesn't use this setting - it will use Tab mode again:

Re: How to create a interactive HTML with two tabs which change the chart image in one based on the value choosen in dropdown list

jthi — Sat, 13 Sep 2025 06:10:55 GMT

For interactive html you usually have to create separate plots. For grouping I tend to utilize Tab Box

Names Default To Here(1); 

dt = open("$SAMPLE_DATA/Big Class.jmp");

gb1_expr = Expr(dt << Graph Builder(
	Show Control Panel(0),
	Variables(X(:weight), Y(:height), Overlay(:sex)),
	Elements(Points(X, Y, Legend(9)), Line Of Fit(X, Y, Legend(11)))
));


gb2_expr = Expr(dt << Graph Builder(
	Show Control Panel(0),
	Variables(X(:weight), Y(:height), Overlay(:age)),
	Elements(Points(X, Y, Legend(9)), Line Of Fit(X, Y, Legend(11)))
));

nw = New Window("My Report",
	tb = Tab Box(
		Tab Page Box("Report1",
			gb1_expr
		),
		Tab Page Box("Report2",
			gb2_expr
		)
	)
);
tb << Set Selected(1);

nw << Save Interactive HTML("$TEMP/DELETEME.html");
wait(0);
nw << close window;

Web("$TEMP/DELETEME.html"); // open for demo purposes

And if you really want to "force" that type of selections, you can do it with some html and javascript

Re: How to create a interactive HTML with two tabs which change the chart image in one based on the value choosen in dropdown list

anandambujaraja — Mon, 15 Sep 2025 10:20:34 GMT

This is great thanks a million Jarmo. Is it possible to have button functionality to be work on HTML or it has to just Jmp report.

Re: How to create a interactive HTML with two tabs which change the chart image in one based on the value choosen in dropdown list

jthi — Mon, 15 Sep 2025 16:18:55 GMT

I don't think you can have that type of functionality by just using JMP as most of the controls are not interactive in the html. You do have some limited capabilities with local data filter

Names Default To Here(1); 

dt = open("$SAMPLE_DATA/Big Class.jmp");

gb = New Window("", dt << Graph Builder(
	Size(525, 454),
	Show Control Panel(0),
	Variables(X(:weight), Y(:height), Overlay(:sex)),
	Elements(Points(X, Y, Legend(3))),
	Local Data Filter(
		Mode(Include(0)),
		Add Filter(columns(:sex), Display(:sex, N Items(2)))
	)
));

gb << Save Interactive HTML("$TEMP/deleteme.html");
wait(0);
gb << Close Window;
Web("$TEMP/deleteme.html");

If I have had need for something special like this, I have generally done it by using html + javascript which loads the pre-created JMP reports to iframe or something similar.