Content Pane Functionality is overrode when moveable (dnd) function is added

[BrandonPrice]

I have to separate functions. The first function gets overrode by the second. What can I do to prevent this?

app.utilitySelector = new utilitySelectorModule();
app.utilitySelector.init();
var utilitySelectorToolBtn = dom.byId("PMSelect");
on(utilitySelectorToolBtn, "click", function (event) {
if (app.utilitySelector.isVisible === true) {
app.utilitySelector.hide();
} else { // not open
app.utilitySelector.show();
}
});

on(dom.byId("Pane"), "click", function(){
var dnd = new Moveable(dom.byId("Pane"));
});

The first functions opens a dojo content pane from a button onlick. The second function makes the content pane moveable. The functionality of the content pane is suspended as soon as the content pane is moved.

Any suggestions?

https://community.esri.com/community/developers/gis-developers?sr=search&searchId=bcfa4c7a-04aa-4d71...‌

https://community.esri.com/groups/web-app-builder-custom-widgets?sr=search&searchId=a21eafc1-98af-47...‌

[RobertScheitlin__GISP]

Brandon,

  The map.infoWindow.domNode part would be the reference to your contentpane in your code.

[BrandonPrice]

Something like contentpane.domNode?

[RobertScheitlin__GISP]

No. If you content pane is created in markup then you need to give it a unique class That way you can use dojo query to get access to the dom node.

[BrandonPrice]

What I have is something like: var handle = query(dom.byId("Pane")); , but would rather follow the esri popup infowindow.domNode syntax.

[RobertScheitlin__GISP]

Brandon,

  You have a lot to learn yet. I beginning to feel like i'm your JS/Dojo instructor . A dojo query uses a class name to find a dom element in your app. So lets say you have your content pane

<div data-dojo-type="dijit/layout/ContentPane" style="width:380px; height:230px; overflow:auto;">‍

Now to get access to this it need a unique id or unique class

<div class="myContentPane" data-dojo-type="dijit/layout/ContentPane" style="width:380px; height:230px; overflow:auto;">‍

Now you can get this element using query:

query('.myContentPane');‍

If you look at the dojo query documentation then you will find that the second parameter in the query method allows you to refine which portion for the html will be queried. If the second parameter is not used then the whole html will be queried.