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; } } }

NavToobar Deactivate in WAB question

StephenSchmidt2

Hi All!

I have a quick question about deactivating the navtoolbar (navToolbar.deactivate();) on a panel close in webapp builder. I can seem to tweak the attached widget to work. The functionality is all there, but it stays live when I exit out of the widget. I've looked at how the draw widget deactivates with no luck. Any suggestions would be greatly appreacited!!

Best as always,

Stephen

Widget.js

Trouver plus de publications taguées avec

Accepted answers

RobertScheitlin__GISP

Stephen,

Here is the widget using pure dojo. I don't think you should have a select state on the previous and next buttons as they are only monetary buttons not toggles like the zoom-in and out, so that is how my code works.

Navigation.zip

All comments

StephenSchmidt2

Here's some small tweaks, but still not there.

Widget.js

Widget.html.zip

StephenSchmidt2

Thanks Robert! I now see how weird my code was working. So, I'm breaking out the domConstruct stuff over to the widget.html now. After that, I'll try to determine the pointer to the button DOM to run the original navtoolbar. As soon as it's running, I'll make sure to mark the question as answered. If it's OK, I'd like to keep it open for a bit, just in case.

Thanks!

Stephen

RobertScheitlin__GISP

Stephen,

If this answered you question then don't forget to mark this thread as answered. To do this you have to open the thread (you can not see the correct answer link from inside your inbox) and then you will see the green star with correct answer link. Just click that link on the thread that answered your question.

StephenSchmidt2

Hi Robert!

Thank you for the reply! I apologize for the messy code.

I should have used a global variable for navToolbar all along. I played around with: navToolbar = new Navigation(this.map) but since it was working, I wasn't to keen on tweaking too much yet.

Thanks for the tip about moving the domConstruct stuff over to the widget.html. I'll most definitely do that.

Thank you as well for the info about narToolbar being a private variable. I'm showing how new I am to this! It make sense now why the onClose function can't see navToolbar.deactivate(). I'll use your suggestions and see what happens!

Thanks again,

Stephen

RobertScheitlin__GISP

Stephen,

You have some very confusing code in your widget.

You have var navToolbar = new Navigation(this.map); three times in your code (line 82, 94, and 106) ???
When you use var navToolbar inside the startup function, that make navToolbar as private variable to the scope of the startup function and your onClose function can not access it using this.navToolbar.
Why are you doing all the domConstruct stuff in the startup function and not just putting all the html element you need in the Widget.html?

If you want to have a global var called navToolbar then you add a line like this right after name: 'sNavigation',

navToolbar: null, then in your startup function you do:

this.navToolbar = new Navigation(this.map);

Rejoindre la conversation

Les membres connectés peuvent publier, suivre les mises à jour, et plus encore. Nouveau ici ? Inscrivez-vous gratuitement.

Liens rapides

Community Help
Find useful guides, FAQs, and documents to help you navigate and make the most of Esri Community.