topic Re: ListView Widget Help in ArcGIS Web AppBuilder Questions

ListView Widget Help

SamLee1 — Tue, 17 Dec 2019 23:08:43 GMT

I am going through this tutorial and I keep getting this error:

Tutorial: Create a ListView widget—Web AppBuilder for ArcGIS (Developer Edition) | ArcGIS for Developers

Attached is the code.

Re: ListView Widget Help

KenBuja — Wed, 18 Dec 2019 12:53:44 GMT

The first error points to line 47

layer.queryFeatures(query, lang.hitch(this, function(featureSet) {‍‍

which means that "layer" is undefined. You get that earlier at line 39

var layer = this.map.getLayer(this.config.layerId);‍

Have you set the layerId property in the config to a valid layer in the map?

Re: ListView Widget Help

SamLee1 — Wed, 18 Dec 2019 14:32:08 GMT

Hello Ken,

Thanks for the response.

What do you mean by that? I went through all the steps.

Was that one of them?

Re: ListView Widget Help

KenBuja — Wed, 18 Dec 2019 14:54:20 GMT

What do the config.js file and the Settings.js file in the settings folder look like? Does they contain an entry for layerId? This is mentioned in the section "Customize the Settings page". This is how this.config gets variables assigned.

Re: ListView Widget Help

SamLee1 — Wed, 18 Dec 2019 15:01:42 GMT

Settings.js:

I do not have a config.js in my settings folder. There wasn't a step for that in the tutorial.

Re: ListView Widget Help

KenBuja — Wed, 18 Dec 2019 15:36:32 GMT

Sorry, that should have been config.json.

Have you gone into the debugger in the Developer Tools and determined what value is being returned for this.config.layerId?

Re: ListView Widget Help

SamLee1 — Wed, 18 Dec 2019 15:51:50 GMT

Yes I did use the debugger. There is no value returned as there is an error.

config.json file:

Re: ListView Widget Help

KenBuja — Wed, 18 Dec 2019 16:24:19 GMT

What does the debugger show for this.config?

Re: ListView Widget Help

SamLee1 — Wed, 18 Dec 2019 16:44:31 GMT

I do not get what you are getting as there is no debugger in my Chrome tools.

Re: ListView Widget Help

KenBuja — Wed, 18 Dec 2019 16:50:06 GMT

In Chrome, it's under the Sources tab.

Re: ListView Widget Help

SamLee1 — Wed, 18 Dec 2019 17:13:33 GMT

When I hover over my this.config is shows undefined.

Re: ListView Widget Help

KenBuja — Wed, 18 Dec 2019 18:49:33 GMT

Can you post the entire directory so I can take a look at it?

Re: ListView Widget Help

SamLee1 — Wed, 18 Dec 2019 18:59:29 GMT

Re: ListView Widget Help

KenBuja — Wed, 18 Dec 2019 19:21:27 GMT

I'm sorry, I meant post the zipped widget files so I can open and run it.

Re: ListView Widget Help

SamLee1 — Wed, 18 Dec 2019 19:31:27 GMT

No icon to upload zip file.

Re: ListView Widget Help

KenBuja — Wed, 18 Dec 2019 19:37:32 GMT

You have to use the reply from the discussion itself, not from the Inbox. You'll see the "Use advanced editor" link in the upper right.

Re: ListView Widget Help

SamLee1 — Wed, 18 Dec 2019 19:54:01 GMT

Attached is the zipped file for the code.

Re: ListView Widget Help

KenBuja — Thu, 19 Dec 2019 13:19:54 GMT

The widget works properly for me, with this.config getting populated properly and the layer instantiated.

In your app, have you added a map and selected a layer in the widget settings?

Re: ListView Widget Help

SamLee1 — Thu, 19 Dec 2019 16:36:56 GMT

Yes I used the default map and layer. Is there a specific one that you used?

How did you get to the Configure ListView window?

I just realized that you are on the server not the client.

This is what I get:

But after I click okay and the widget this happens:

Re: ListView Widget Help

KenBuja — Sat, 11 Dec 2021 20:25:16 GMT

Your problem is that your map doesn't have any layers. It needs at least one layer to properly make "this.config". I tested with an empty map and got that same error.

Your remedy would be to check to see if there are layers in your map. You could add line 10-15 to your Settings.js file (adding in the module and argument for Message)

define([
 ...
 "jimu/dijit/Message"
],
  function(..., Message) [

      LayerInfos.getInstance(this.map, this.map.itemInfo).then(
        lang.hitch(this, function (layerInfosObj) {
          var infos = layerInfosObj.getLayerInfoArray();
          if (infos.length == 0) {
            new Message({
              type: "error",
              message: "Your map must have at least one layer!"
            });
          }‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍