Calling a connector function from within a custom widget?

[rahul.singh]

@John_L

getValue(‘myProp’, (value) => {
console.log(JSON.stringify(value));
});

Again Getting error

[John]

I want to interrupt the troubleshooting for a second to give a shout out to @thorsten.langner and @John_L for going above and beyond and troubleshooting another community member’s code. Debugging custom widgets is not easy. It’s awesome to see folks supporting one another and I really appreciate the care you all are showing for the community

[thorsten.langner]

As described in my post, you need to watch the single qoutes not beeing so ‘…’ but so '...'

Try:

@thorsten.langner

getValue('HQ', (value) => {
console.log(value)
});

[rahul.singh]

I created a new App & Widget & try to pass a variable with default value into custom widget & Output is still showing NULL.

App:

Variable:

Custom Widget:

[John_L]

What integer value did you set “S” value to in the widget preview?

[rahul.singh]

I have set a default value of S to 5 in Tulip App as shown in picture 2 & There is no values set in Widget preview.

[John_L]

When building a custom widget the widget preview is what you would use to simulate the values coming in and values/events going out of the widget back into the app. So you need to set the preview value to see how the widget will handle it The custom widget design view is not tied to any tulip application.

[avinash.kumar]

I want to get value in custom widget from application variable x = 5; how can we acheive data in custom widget.This can resolve to solve multiple question;
If I have var x = 5 in application and want to console.log in custom widget and my expectation is to be get value in console.log in custom widget kindly resolve ASAP.

[rahul.singh]

I tested whether my code is able to handle & get data from Props.

When I pass a value in Widget window:

When i do not pass the value:

Query: - Is it possible to get data of a variable into custom widget environment using props? & if it is, then How?

That’s what I’m trying to find out!!

[John_L]

Not directly for debugging in the custom widget environment if I understand you correctly. However if you want to see what the widget is doing from the application side, I suggest using javascript alerts inside your custom widget code, to see prop values that the widget receives

[thorsten.langner]

@rahul.singh @avinash.kumar

you cant do a consol.log to output values… try to fire an event like so:

getValue('Input',(internalVar)=>{ //Property Name: 'Input' //variable inside of getValue(): internalVar
   if (internalVar != null){ 
       outputVal = internalVar * 2;
       fireEvent('Output', outputVal); //Event Name: 'Output' // Event Value: outputVal
   }; 
});

Also read: Custom Widgets Overview (tulip.co)

---

Edit:
You can actualy use console.log(outputVal); however this is no output to your TULIP Application but to your Browser Console!

[John_L]

I agree @thorsten.langner the best way to understand custom widgets is read the documentation and then play around with them within a simple tulip application.

[avinash.kumar]

But The question is How to set the json data from connector to my props. in custom widget?

[thorsten.langner]

Place your widget in your app.
You will find it there:

Then you see the properties of the widget on the right side bar (as of every other widget too…)

There you can set the property value to a static value or a variable (as in your use case).

E.g. on an TOOL TIP Custom Widget:

Then the Variable value is linked to the widget as property.

[John_L]

I think it would be a good idea if you watch the custom widget tutorial and play around with a simple application and a simple custom widget at first. Its also a good idea to check that the data type from the output of the connector function matches the data type your widget is expecting (including any child properties if they exist). Good luck.