[BUG] onInit() is executed AFTER the widget renders

self.onInit() is executed only after the widget renders, which is a problem for initialization of the initial values. Is there any way around it?

An analog of the method which I am looking for is componentWillMount in React. This method is only called before the initial render.

Code to replicate the issue:

HTML:

<script>
    console.log($customValue)
</script>

JS:

 self.onInit = function() {
        self.ctx.$scope.data = self.ctx.defaultSubscription.data
        $customValue = self.ctx.defaultSubscription.data[0]

        console.log($customValue)
    }

Expected result:

$customValue is printed two times in the console

Actual result:

• first printed line: ReferenceError: $customValue is not defined[Learn More]
• second printed line: actual value of $customValue

[nsantos111]

Hi @alexsmartens,

After reading some articles about jQuery I put my hands on the task of moving from my very complex static html to the jQuery built layout. During the process of wall breaking with my head, I found an error on my initial JS code. After fixing it, the errors on the functions called from the html were fixed - the issue was not related with onInit() not being called before the html rendering after all!

Thanks for your support and for pointing the jQuery option – is something that I must get into but definitely with a more simple html layout.

[nsantos111]

Yes, that’s more or less the case. I’m not looking for whether the checkboxes are selected or not, but for some properties of the array objects - and have one checkbox row for each object. The array is filled in at onInit() beginning. The issue occurs when the array is not filled before the rendering of the html which only happens sometimes.

I understood your suggestion (of building the elements on onInit instead of in the html part) and if there’s no other solution I’ll give it a try as soon as I finish other widget I’m implementing - Never used jQuery before…

Thanks