Calling a function from Attribute Table widget?

1680
16
Jump to solution
10-27-2017 07:08 AM
AnnCrystal
New Contributor II

The attribute table widget has a function _switchTable which toggles attribute table. I would like to call it from a off panel widget. I looked into Communication between widgets- but it provides methods to fetchData. I am little confused. Any thoughts? Robert, have done anything in this line?

Thanks in advance

0 Kudos
16 Replies
AnnCrystal
New Contributor II

Thanks Robert for the tips.

Dojo is not going away so I am not sure about:

Sitepen is no longer doing anything with Dojo

My Sitepen reference was regarding training- Let me elaborate-I was planning take a Dojo online workshop which Sitepen used to host. But, they redesigned their website and all the pages which mentioned about the workshop schedules disappeared. So, I am stuck with no options for a jump-start training:(

0 Kudos
AnnCrystal
New Contributor II

Robert Scheitlin, GISP wrote:

Ann,

 

  Ahh, now I see what you were saying about the on event handler. So the issue I see in your code is that _AttributeTable is likely out of scope inside your on event handler. So you need to use lang.htich to get around that.

var _AttributeTable = this.widgetManager.getWidgetsByName("AttributeTable");
html.setAttr(this.domNode, 'title', this.label);
d = domConstruct.create('div');
on(d, 'click', lang.hitch(this, function{
  _AttributeTable._switchTable();
}),d);

Or you can use:

this._AttributeTable = this.widgetManager.getWidgetsByName("AttributeTable");
html.setAttr(this.domNode, 'title', this.label);
d = domConstruct.create('div');
on(d, 'click', function{
  this._AttributeTable._switchTable();
},d);

Hi Robert:

I added the code to the widget. But on clicking the button, nothing happens. What can be wrong?

My full code of Widget here:

define([
'dojo/_base/declare',
'jimu/BaseWidget',
'dojo/_base/html',
'dojo/on',
'dojo/_base/lang',
'dojo/dom-construct',
'dojo/dom-class',
'dojo/topic'
],
function(
declare,
BaseWidget,
html,
on,
lang,
domConstruct,
domClass,
dojoTopic) {
var clazz = declare([BaseWidget], {

name: 'AttributeTableToggle',
baseClass: 'jimu-widget-AttributeTableToggle',
icon: 'images/icon.png',
startup: function() {
this.inherited(arguments);
var _AttributeTable = this.widgetManager.getWidgetsByName("AttributeTable");
html.setAttr(this.domNode, 'title', this.label);
d = domConstruct.create('div');
on(d, 'click', lang.hitch(this, function(){
domClass.toggle(this, "selected");
dojoTopic.publish('attributeTable/toggle', "selected")
_AttributeTable._switchTable();
}),d);
// html.place(d, this.domNode);
}

});

return clazz;
});

0 Kudos
RobertScheitlin__GISP
MVP Emeritus

Ann,

   I can see from this that you are pretty new to JS coding. There should be errors in your browsers console for sure, assuming the widget even loads.

You have this line in your code:

var _AttributeTable = this.widgetManager.getWidgetsByName("AttributeTable");

But you you don't have this.widgetManager defined any where.

define([
...
    'jimu/WidgetManager',
...
],
  function(
...
    WidgetManager,
...

You are adding a div:

d = domConstruct.create('div');

But there is not style of class that specifies the height, width, color, etc.

Then you have commented out actually placing the div in your widgets domNode:

// html.place(d, this.domNode);
0 Kudos
AnnCrystal
New Contributor II

Thanks Robert. Yes, I am new to js programming and that I have to jump in Dojo right away for my internship. I was trying to modify an old widget code which places div and closes the table using a div tag "selected". However, that stopped working. Then, I saw that Attribute table widget has a function _switchTable() and was trying to implement it. But I am confused about how to call it without even using "d" as in 

d = domConstruct.create('div');

and this line:

on(d, 'click', lang.hitch(this, function(){
_AttributeTable._switchTable();
}),d);

I was hoping to call that function without creating the variable "d" as this function need to be called on widget button click. Is there a simple way to do that  on the "on click" event? Thanks

0 Kudos
RobertScheitlin__GISP
MVP Emeritus

Ann,

   So am I understanding you to say that you really do not want the widget to have a panel or UI you just want it to fire the switchtable method when the widget icon is clicked?

0 Kudos
AnnCrystal
New Contributor II

Yes Robert, that's correct. I want to toggle Attribute Table when widget icon is clicked. 

0 Kudos
RobertScheitlin__GISP
MVP Emeritus

Then you should look at my Layer Toggle Button widget for guidance:

https://community.esri.com/docs/DOC-8592-layer-toggle-button-widget-version-22-01132017