This issue occurs when editing a single event, example: events.html?ref=9&subpage=event.html
Problem
Description
An alert window shows when editing an event. The alert window says:
Unable to save changes: Value cannot be null.
Parameter name: viewId
This is only happening when the user chooses a value on a JUI SelectListView control with a list style of: ESelectListType.SearchableDropDown but only when user has typed any text in the filtering text-box at the top of the drop-down.
This is happening because the searchable drop down control created by the Material Bootstrap JS library is creating a wrapper control that copies the CSS classes, including the class .jui-input. The JS file in HomeSeer called jui-events.js is attaching a JQuery listener to events of type change for any control of class .jui-input so when the user types text into the search box and then selects an option in the drop-down, 2 changes are registered: the text entered into the text box and the option changed in the drop-down.
The problem is that the text-box does not have a valid JUI element ID and the HS JS script is sending an invalid post-back message to the event.html page, such as the following:
The fix is simple: the wrapper HTML elements created by the MDB library for the searchable drop-down has a very specific CSS class: .select-wrapper that can be used to filter any change events. Specifically:
This repros with HSBuddy but it is not specific to this plug-in. Any plug-in that has an event action/trigger with a searchable drop-down will repro. For HSBuddy in specific:
Create a new event
In the actions add one for: HSBuddy: Send Push Notification
In the Tap actions section choose the action type: Show a device
In the Device drop-down, first enter text to filter-down the options, then tap any of the options in the drop-down
Environment
HomeSeer
OS
Any OS (tested on Windows and Linux)
HS Version
v4.2.16.0
Development
PSDK Version
v1.4.2.0
Language
C# / Javascript
IDE
VSCode
Dev OS
Mac
Page
What page did you encounter this on?
This issue occurs when editing a single event, example:
events.html?ref=9&subpage=event.html
Problem
Description
An alert window shows when editing an event. The alert window says:
This is only happening when the user chooses a value on a JUI
SelectListView
control with a list style of:ESelectListType.SearchableDropDown
but only when user has typed any text in the filtering text-box at the top of the drop-down.This is happening because the searchable drop down control created by the Material Bootstrap JS library is creating a wrapper control that copies the CSS classes, including the class
.jui-input
. The JS file in HomeSeer calledjui-events.js
is attaching a JQuery listener to events of typechange
for any control of class.jui-input
so when the user types text into the search box and then selects an option in the drop-down, 2 changes are registered: the text entered into the text box and the option changed in the drop-down.The problem is that the text-box does not have a valid JUI element ID and the HS JS script is sending an invalid post-back message to the event.html page, such as the following:
The fix is simple: the wrapper HTML elements created by the MDB library for the searchable drop-down has a very specific CSS class:
.select-wrapper
that can be used to filter anychange
events. Specifically:Screenshots
Attach screenshots showing what you are seeing.
Expected Behavior
What did you expect to see?
Steps to Reproduce
This repros with HSBuddy but it is not specific to this plug-in. Any plug-in that has an event action/trigger with a searchable drop-down will repro. For HSBuddy in specific:
Logs
NA