I'm adding an action to my popup, and I've encountered an issue where setting the actionsMenuEnabled to false on my view's popup object doesn't seem to do anything. It still uses the menu instead of just putting the icons across the top. I initially tried setting the property when configuring the view's popup: view = new MapView ( { container : "viewDiv" , map : map , center : [ - 80.2807416961724 , 26.9095216535089 ] , zoom : 17 , popup : { actionsMenuEnabled : false , dockEnabled : true , dockOptions : { buttonEnabled : false , breakpoint : false } } } ) ; But this didn't work: I still had the menu. I noticed in the only sample code I could find that uses this property (this one) that it is used during a call to view.when(). So then I tried calling view.when() and setting the property there: view . when ( function ( ) { var popup = view . popup ; popup . actionsMenuEnabled = false ; } ) ; I also tried: view . when ( function ( ) { view . popup . actionsMenuEnabled = false ; } ) ; And still, no luck. I was wondering if it was to do with the instancing of the view object, but it seems to me like the call to view.when() should handle that. For what it's worth, here's an example of the action being defined for a particular site: var actnCAB_1000 = { title : "Trace From this Site" , id : "trace_1" , image : "/resources/traceicon.png" , } ; var site1Template = { title : "CAB_1000" , actions : [ actnCAB_1000 ] , content : "[a very long string containing html tables goes here]" } ; And here's the event handler (which works fine): view . popup . on ( "trigger-action" , function ( event ) { if ( event . action . id . substring ( 0 , 6 ) === "trace_" ) { window . open ( "TraceReport?site=" . concat ( event . action . id . substring ( 6 ) ) ) ; } } ) ; To answer the question of why I'm defining a new action for each site, it's so I can pass the integer that follows the underscore in the action variable's name to the event handler. There's probably a more elegant way to do that, and I'm all ears if anyone wants to suggest it.

nav[aria-label="Primary Navigation"] { padding: 0; & ul { list-style: none; width: 100%; display: flex; flex-direction: row; justify-content: start; align-items: start; gap: 30px; padding: 0; & li { margin: 0; } & ul li { list-style: none; } } }

ActionsMenuEnabled does not seem to work

DarinRodberg

I'm adding an action to my popup, and I've encountered an issue where setting the actionsMenuEnabled to false on my view's popup object doesn't seem to do anything. It still uses the menu instead of just putting the icons across the top.

I initially tried setting the property when configuring the view's popup:

view <SPAN class="operator token">=</SPAN> <SPAN class="keyword token">new</SPAN> <SPAN class="token class-name">MapView</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">{</SPAN>
	container<SPAN class="punctuation token">:</SPAN> <SPAN class="string token">"viewDiv"</SPAN><SPAN class="punctuation token">,</SPAN>
	map<SPAN class="punctuation token">:</SPAN> map<SPAN class="punctuation token">,</SPAN>
	center<SPAN class="punctuation token">:</SPAN> <SPAN class="punctuation token">[</SPAN><SPAN class="operator token">-</SPAN><SPAN class="number token">80.2807416961724</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="number token">26.9095216535089</SPAN><SPAN class="punctuation token">]</SPAN><SPAN class="punctuation token">,</SPAN>
	zoom<SPAN class="punctuation token">:</SPAN> <SPAN class="number token">17</SPAN><SPAN class="punctuation token">,</SPAN>
	popup<SPAN class="punctuation token">:</SPAN> <SPAN class="punctuation token">{</SPAN>
		actionsMenuEnabled<SPAN class="punctuation token">:</SPAN> <SPAN class="keyword token">false</SPAN><SPAN class="punctuation token">,</SPAN>
		dockEnabled<SPAN class="punctuation token">:</SPAN> <SPAN class="keyword token">true</SPAN><SPAN class="punctuation token">,</SPAN>
		dockOptions<SPAN class="punctuation token">:</SPAN> <SPAN class="punctuation token">{</SPAN>
			buttonEnabled<SPAN class="punctuation token">:</SPAN> <SPAN class="keyword token">false</SPAN><SPAN class="punctuation token">,</SPAN>
			breakpoint<SPAN class="punctuation token">:</SPAN> <SPAN class="keyword token">false</SPAN>
		<SPAN class="punctuation token">}</SPAN>
	<SPAN class="punctuation token">}</SPAN>
<SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>‍‍‍‍‍‍‍‍‍‍‍‍‍‍<SPAN class="line-numbers-rows"><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN></SPAN>

But this didn't work: I still had the menu.

I noticed in the only sample code I could find that uses this property (this one) that it is used during a call to view.when(). So then I tried calling view.when() and setting the property there:

view<SPAN class="punctuation token">.</SPAN><SPAN class="token function">when</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="keyword token">function</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">)</SPAN> <SPAN class="punctuation token">{</SPAN>
	<SPAN class="keyword token">var</SPAN> popup <SPAN class="operator token">=</SPAN> view<SPAN class="punctuation token">.</SPAN>popup<SPAN class="punctuation token">;</SPAN>
	popup<SPAN class="punctuation token">.</SPAN>actionsMenuEnabled <SPAN class="operator token">=</SPAN> <SPAN class="keyword token">false</SPAN><SPAN class="punctuation token">;</SPAN>
<SPAN class="punctuation token">}</SPAN>‍‍‍‍<SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>‍‍‍‍<SPAN class="line-numbers-rows"><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN></SPAN>

I also tried:

view<SPAN class="punctuation token">.</SPAN><SPAN class="token function">when</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="keyword token">function</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">)</SPAN> <SPAN class="punctuation token">{</SPAN>
	view<SPAN class="punctuation token">.</SPAN>popup<SPAN class="punctuation token">.</SPAN>actionsMenuEnabled <SPAN class="operator token">=</SPAN> <SPAN class="keyword token">false</SPAN><SPAN class="punctuation token">;</SPAN>
<SPAN class="punctuation token">}</SPAN>‍‍‍<SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>‍‍‍<SPAN class="line-numbers-rows"><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN></SPAN>

And still, no luck. I was wondering if it was to do with the instancing of the view object, but it seems to me like the call to view.when() should handle that.

For what it's worth, here's an example of the action being defined for a particular site:

<SPAN class="keyword token">var</SPAN> actnCAB_1000 <SPAN class="operator token">=</SPAN> <SPAN class="punctuation token">{</SPAN>
	title<SPAN class="punctuation token">:</SPAN> <SPAN class="string token">"Trace From this Site"</SPAN><SPAN class="punctuation token">,</SPAN>
	id<SPAN class="punctuation token">:</SPAN> <SPAN class="string token">"trace_1"</SPAN><SPAN class="punctuation token">,</SPAN>
	image<SPAN class="punctuation token">:</SPAN> <SPAN class="string token">"/resources/traceicon.png"</SPAN><SPAN class="punctuation token">,</SPAN>
<SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">;</SPAN>
<SPAN class="keyword token">var</SPAN> site1Template <SPAN class="operator token">=</SPAN> <SPAN class="punctuation token">{</SPAN>
	title<SPAN class="punctuation token">:</SPAN> <SPAN class="string token">"CAB_1000"</SPAN><SPAN class="punctuation token">,</SPAN>
	actions<SPAN class="punctuation token">:</SPAN> <SPAN class="punctuation token">[</SPAN>actnCAB_1000<SPAN class="punctuation token">]</SPAN><SPAN class="punctuation token">,</SPAN>
	content<SPAN class="punctuation token">:</SPAN> <SPAN class="string token">"[a very long string containing html tables goes here]"</SPAN>
<SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">;</SPAN>‍‍‍‍‍‍‍‍‍‍<SPAN class="line-numbers-rows"><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN></SPAN>

And here's the event handler (which works fine):

view<SPAN class="punctuation token">.</SPAN>popup<SPAN class="punctuation token">.</SPAN><SPAN class="token function">on</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="string token">"trigger-action"</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="keyword token">function</SPAN><SPAN class="punctuation token">(</SPAN>event<SPAN class="punctuation token">)</SPAN> <SPAN class="punctuation token">{</SPAN>
	<SPAN class="keyword token">if</SPAN> <SPAN class="punctuation token">(</SPAN>event<SPAN class="punctuation token">.</SPAN>action<SPAN class="punctuation token">.</SPAN>id<SPAN class="punctuation token">.</SPAN><SPAN class="token function">substring</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="number token">0</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="number token">6</SPAN><SPAN class="punctuation token">)</SPAN> <SPAN class="operator token">===</SPAN> <SPAN class="string token">"trace_"</SPAN><SPAN class="punctuation token">)</SPAN> <SPAN class="punctuation token">{</SPAN>
		window<SPAN class="punctuation token">.</SPAN><SPAN class="token function">open</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="string token">"TraceReport?site="</SPAN><SPAN class="punctuation token">.</SPAN><SPAN class="token function">concat</SPAN><SPAN class="punctuation token">(</SPAN>event<SPAN class="punctuation token">.</SPAN>action<SPAN class="punctuation token">.</SPAN>id<SPAN class="punctuation token">.</SPAN><SPAN class="token function">substring</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="number token">6</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
	<SPAN class="punctuation token">}</SPAN>
<SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>‍‍‍‍‍<SPAN class="line-numbers-rows"><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN></SPAN>

To answer the question of why I'm defining a new action for each site, it's so I can pass the integer that follows the underscore in the action variable's name to the event handler. There's probably a more elegant way to do that, and I'm all ears if anyone wants to suggest it.