topic Re: Question about creating custom in-panel widget. in Web AppBuilder Custom Widgets Questions

Question about creating custom in-panel widget.

SophieYe — Mon, 16 Mar 2015 19:35:06 GMT

Hi All,

I started to play with WAB recently. I am following the steps from ESRI's website: Create a custom in-panel widget—Web AppBuilder fo... . Now I can see the custom widget in the widget pool. But after I added the widget to my app and clicked on it to test, it poped up a message saying "Create Widget Error". When I tested it through http://[your host name:3344]/webapp/?config=sample-configs/config-demo.json, I got the same error. (I have downloaded the missing sample-configs folder from GeoNet.). Then I started the steps for creating a custom widget all over again and tested step by step. And it worked fine until Step 8 "Access a map". After I followed the instructions to access a map, I got the Create Widget Error message. I am wondering if anyone has some ideas about how to solve this problem.

Thank you very much!

Re: Question about creating custom in-panel widget.

SophieYe — Wed, 18 Mar 2015 15:51:02 GMT

Any ideas about this? Thanks!

Re: Question about creating custom in-panel widget.

RobertScheitlin__GISP — Wed, 18 Mar 2015 15:53:58 GMT

Sophie,

Open your browsers developer tools and see what the console says

Re: Question about creating custom in-panel widget.

SophieYe — Wed, 18 Mar 2015 16:46:57 GMT

Hi Robert,

Thanks for your reply. Here is the information from the console:

GET http://[machine name]/webappbuilder/apps/12/widgets/MyWidget/setting/Setting.js 404 (Not Found) init.js:41
Error: scriptError {src: "dojoLoader", info: Array[2], stack: (...), message: "scriptError"} init.js:41
src: dojoLoader init.js:41
info: ["/webappbuilder/apps/12/widgets/MyWidget/setting/Setting.js", Event] init.js:42
Uncaught SyntaxError: Unexpected identifier Widget.js:20
create [widgets/MyWidget/Widget] error:TypeError: number is not a function WidgetManager.js:97
TypeError: number is not a function {stack: (...), message: "number is not a function"}
- message: "number is not a function"
- stack: (...)
- get stack: function () { [native code] }
- set stack: function () { [native code] }
- __proto__: Error

"TypeError: number is not a function

Any ideas from here? Thanks a lot!

Sophie

Re: Question about creating custom in-panel widget.

RobertScheitlin__GISP — Wed, 18 Mar 2015 17:04:27 GMT

Sophie,

Sure in the manifest.json make sure your properties look like this:

"properties": {

"inPanel":true,

"hasLocale": true,

"hasStyle":true,

"hasConfig":true,

"hasUIFile":true,

"hasSettingPage":false,

"hasSettingUIFile":false,

"hasSettingLocale":false,

"hasSettingStyle":false,

"IsController":false

}

Re: Question about creating custom in-panel widget.

SophieYe — Wed, 18 Mar 2015 18:45:42 GMT

Hi Robert,

Thanks. Now the "cannot get setting file" error is gone. But I still get the following errors:

Uncaught SyntaxError: Unexpected identifier Widget.js:20
create [widgets/MyWidget/Widget] error:TypeError: number is not a function WidgetManager.js:97
TypeError: number is not a function {stack: (...), message: "number is not a function"}
- message: "number is not a function"
- stack: (...)
- get stack: function () { [native code] }
- set stack: function () { [native code] }
- __proto__: Error

"TypeError: number is not a function

Could you please help me with that? Thank you.

Sophie

Re: Question about creating custom in-panel widget.

TimWitt2 — Wed, 18 Mar 2015 18:48:15 GMT

Sophie,

this error is usually caused by unbalanced ( { [ within your widget.js

Tim

Re: Question about creating custom in-panel widget.

SophieYe — Wed, 18 Mar 2015 20:50:54 GMT

Hi Robert and Tim,

Thank you both so much for helping me solve this problem. After I balanced all "(, [, {", I still got the error. But it worked fine after I restarted the Web AppBuilder.

Thank you very much. I really appreciated your help.

Sophie