diff --git a/docs/nodes/widgets/ui-dropdown.md b/docs/nodes/widgets/ui-dropdown.md index 1ce6f3bfb..c025fbf0e 100644 --- a/docs/nodes/widgets/ui-dropdown.md +++ b/docs/nodes/widgets/ui-dropdown.md @@ -20,6 +20,8 @@ props: dynamic: false Allow Search: description: Allows user to type a new value, filtering the list of possible values to choose. + Msg trigger: + description: Specify when an output message should be send. On every change or when the dropdown is closed. dynamic: Label: payload: msg.ui_update.label @@ -33,6 +35,9 @@ dynamic: Class: payload: msg.ui_update.class structure: ["String"] + Msg trigger: + payload: msg.ui_update.msgTrigger + structure: ["String"] --- diff --git a/nodes/widgets/ui_dropdown.html b/nodes/widgets/ui_dropdown.html index 5c06df3fd..f93e38448 100644 --- a/nodes/widgets/ui_dropdown.html +++ b/nodes/widgets/ui_dropdown.html @@ -40,7 +40,8 @@ topicType: { value: 'msg' }, className: { value: '' }, // This field controls if the used component is going to be a `v-combox` or a `v-select`, `v-combox` allows typing and filtering possible values - typeIsComboBox: { value: true } + typeIsComboBox: { value: true }, + msgTrigger: { value: 'onChange' } }, inputs: 1, outputs: 1, @@ -61,6 +62,9 @@ if (this.typeIsComboBox === undefined) { $('#node-input-typeIsComboBox').prop('checked', true) } + if (this.msgTrigger === undefined) { + $('#node-input-msgTrigger').val('onChange') + } // if this groups parent is a subflow template, set the node-config-input-width and node-config-input-height up // as typedInputs and hide the elementSizer (as it doesn't make sense for subflow templates) if (RED.nodes.subflow(this.z)) { @@ -222,6 +226,13 @@
option
+
+ + +
@@ -248,4 +259,4 @@
- \ No newline at end of file + diff --git a/nodes/widgets/ui_dropdown.js b/nodes/widgets/ui_dropdown.js index 740a7bec7..1e66b4f6e 100644 --- a/nodes/widgets/ui_dropdown.js +++ b/nodes/widgets/ui_dropdown.js @@ -26,6 +26,10 @@ module.exports = function (RED) { // dynamically set "label" property statestore.set(group.getBase(), node, msg, 'multiple', update.multiple) } + if (typeof update.msgTrigger !== 'undefined') { + // dynamically set "msgTrigger" property + statestore.set(group.getBase(), node, msg, 'msgTrigger', update.msgTrigger) + } } if (msg.options) { // backward compatibility support diff --git a/ui/src/widgets/ui-dropdown/UIDropdown.vue b/ui/src/widgets/ui-dropdown/UIDropdown.vue index 467667426..1eb3e8a19 100644 --- a/ui/src/widgets/ui-dropdown/UIDropdown.vue +++ b/ui/src/widgets/ui-dropdown/UIDropdown.vue @@ -4,6 +4,7 @@ :multiple="multiple" :chips="chips" :clearable="clearable" :items="options" item-title="label" item-value="value" variant="outlined" hide-details="auto" auto-select-first :error-messages="options?.length ? '' : 'No options available'" @update:model-value="onChange" + @blur="onBlur" >