# Uibuilder web components

**URL:** <https://discourse.nodered.org/t/uibuilder-web-components/66453>\
**Category:** General\
**Tags:** uibuilder\
**Created:** [15 August 2022 16:39 UTC](https://discourse.nodered.org/t/uibuilder-web-components/66453 "2022-08-15T16:39:15Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![magicman](https://avatars.discourse-cdn.com/v4/letter/m/73ab20/32.png) [@magicman](https://discourse.nodered.org/u/magicman)\
**Post date:** [15 August 2022 16:39 UTC](https://discourse.nodered.org/t/uibuilder-web-components/66453/1 "2022-08-15T16:39:15Z")

</div>

Hi,  
i am attempting to send a temperature value of lets say 29 to uibuilder using web components  
i have an inject button that sends this:-  
{  
"method": "update",  
"id": "otemp",  
}  
i also send a msg.payload of "29"

i have a line in html  
` <labelled-value label="My Value" label id ="otemp" value= "18"></labelled-value>`

the value 18 does indeed change but not to 29 the value is repeated and i get 2929

i have read a reference to repeated values but do not understand what i need to do, any help would be appreciated.  
Thanks in anticipation  
Magicman

---

<div class="post-metadata">

**Author:** ![TotallyInformation](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/totallyinformation/32/31_2.png) [@TotallyInformation](https://discourse.nodered.org/u/TotallyInformation)\
**Post date:** [16 August 2022 08:28 UTC](https://discourse.nodered.org/t/uibuilder-web-components/66453/2 "2022-08-16T08:28:07Z")

</div>

I guess it rather depends on how your `labelled-value` component works. But getting the result you are means that you have catenated together 2 strings somehow.

What framework are you using? Vue? Something else?

If Vue, then you need to replace the static `="18"` with a Vue data variable and update that with your incoming msg payload.

---

<div class="post-metadata">

**Author:** ![magicman](https://avatars.discourse-cdn.com/v4/letter/m/73ab20/32.png) [@magicman](https://discourse.nodered.org/u/magicman)\
**Post date:** [16 August 2022 15:36 UTC](https://discourse.nodered.org/t/uibuilder-web-components/66453/3 "2022-08-16T15:36:32Z")

</div>

Hi ,  
Yes it is vue and using the data variable did work , still not sure how I got 2 strings?  
but as always problem solved !

Thank you @TotallyInformation

---

<div class="post-metadata">

**Author:** ![fmarzocca](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/fmarzocca/32/35901_2.png) [@fmarzocca](https://discourse.nodered.org/u/fmarzocca)\
**Post date:** [16 August 2022 17:29 UTC](https://discourse.nodered.org/t/uibuilder-web-components/66453/4 "2022-08-16T17:29:11Z")

</div>

> [@magicman](#):
>
> still not sure how I got 2 strings

You can make use of JSON objects, so you can send as many stringe as you need

---

<div class="post-metadata">

**Author:** ![system](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/1X/d073cd938eafa2e558d7c2cd59003b3ef4963033.png) [@system](https://discourse.nodered.org/u/system)\
**Post date:** [30 August 2022 17:29 UTC](https://discourse.nodered.org/t/uibuilder-web-components/66453/5 "2022-08-30T17:29:45Z")

</div>

This topic was automatically closed 14 days after the last reply. New replies are no longer allowed.