custom widget: why won't this onInit execute?

I have exceeded my knowledge on this and I cannot figure out why my code will not complete. I am convinced there is something in the structure that is preventing this from moving forward but i cannot put eyes on the problem.  I have been through all 4 files multiple times and I don't think I can optimize them any further. I have to admit that I am impressed with my progress in a week, starting with knowing nothing about java and having worked with css last in 2010, I have a nearly functional widget.  Can someone please look this over? 

After some additional testing it seems this MIGHT new related the call for the visuals.session.itemManager.  The import seems to work fine but if i add a const for im = (visuals.session.itemManager) I get an error when updating the widget that the dependancy can't be found.  It's trying to locate it in the custom-lib of the widget, but I think that dependancy should come from WebIQ designer. I don't really understand why that is not working, but that seems to be stopping my onInit and thus teh widget never fully builds. 

Best reply by webiq-sk

As I stated before you should never use any "id" attributes in widgets as these make your HTML invalid (even though no browser cares) if the widget is inserted more than once on the same HTML page (i.e. HMI). Please see the link I posted before. You don't need to specify any id for any WebIQ widgets - it's also not documented that you should do that on purpose as it wouldn't make sense as any widget can be inserted multiple times into any HMI hence leading to invalid HTML if you'd use an "id" attribute in your widget HTML code.

Specifying the class(es) is not required either, but you probably want to set it to be able to style your widget using CSS.

For using shmi.getUiElement(elementName) you always have to specify the data-ui-attribute name you specified (hence it's called getUiElement). This is also specified in the documentation:

https://www.smart-hmi.com/user/download/deliver/docs/documentation-webiq-visuals-reference-2.14-3d30/shmi.html#.getUiElement__anchor

If you simply follow our tutorial for creating a custom widget exactly you should get to know all of these details - you should not use that manual when reading it for the first time to directly implement your own custom widget, instead you should follow the steps exactly to create the custom widget from the tutorial and only afterwards create your own custom widget:
https://www.smart-hmi.com/user/download/deliver/docs/documentation-how-to-simple-control-2.14-3d30/index.html

View original
bco-stop-btn.js
8.87KB
7 replies