diff --git a/nodes/widgets/ui_button_group.js b/nodes/widgets/ui_button_group.js index ad3849719..14ba6d1ef 100644 --- a/nodes/widgets/ui_button_group.js +++ b/nodes/widgets/ui_button_group.js @@ -9,9 +9,31 @@ module.exports = function (RED) { // which group are we rendering this widget const group = RED.nodes.getNode(config.group) + // Keep the code of this function in sync with the client-side function + function findOptionByValue (val) { + const opt = config.options?.find(option => { + if (typeof (val) === 'object') { + return (JSON.stringify(val) === JSON.stringify(option.value)) + } else { + return option.value === val + } + }) + if (opt) { + return opt + } + return null + } + const evts = { onChange: true, beforeSend: function (msg) { + if (typeof msg.payload !== 'undefined') { + const option = findOptionByValue(msg.payload) + if (option) { + node.status({ fill: 'blue', shape: 'dot', text: option.label || option.value }) + } + } + if (msg.ui_update) { const update = msg.ui_update if (typeof update.options !== 'undefined') { diff --git a/ui/src/widgets/ui-button-group/UIButtonGroup.vue b/ui/src/widgets/ui-button-group/UIButtonGroup.vue index 5aaeab2ac..f33a5f89d 100644 --- a/ui/src/widgets/ui-button-group/UIButtonGroup.vue +++ b/ui/src/widgets/ui-button-group/UIButtonGroup.vue @@ -118,6 +118,7 @@ export default { this.$socket.emit('widget-change', this.id, value) } }, + // Keep the code of this function in sync with the server-side function findOptionByValue: function (val) { const opt = this.options?.find(option => { if (typeof (val) === 'object') {