I want to use an entity_id from a drop down select to have a card display the information from a specific sensor, in this case to have only one camera feed displayed on my main page and to choose which one from a drop down input select. I haven’t found a way to do the indirect reference. For example replacing:
type: custom:state-switch
entity: input_select.camera_list
states:
East Rear:
type: custom:advanced-camera-card
cameras:
- camera_entity: camera.ds_xxxx_xxx_1
with
type: custom:state-switch
entity: input_select.camera_list
type: custom:advanced-camera-card
cameras:
- camera_entity: input_select.camera_list
I’ve experimented with various {} bracket and apostrophe combinations to no avail. I tried using filter: template : (properly formatted) with codes such as:
{% for state in states.camera %}
{% if state.name == 'West Rear' %}
{{ state.entity_id }}
{% set ns.id_var = state.entity_id %}
{% endif %}
{% endfor %}
trying to use ns.my_var (various {} “” combos) and without the namespace just leaving the {{state.entity_id}}. The state resolves to the correct camera name (i.e. camera.ds_xxxx_xxx_1) but it still doesn’t work.
Maybe the card resolves before the code executes. In most cases I get:
Invalid configuration: [ “cameras[0] → camera_entity” ]
type: custom:advanced-camera-card
cameras:
- camera_entity:
'[object Object]': null'
The card resolves correctly if the camera.xxx… is hard coded
HA 2025.5.1
running on a Virtual Box on debian 12, HAOS
Any help or thoughts would be most appreciated. I would like to employ the solution in order to choose other sensor cards to display ( I’ve also tried auto-entities and state-switch using the above constructs)
Thanks for the suggestions Ildar_Gabdullin. I’ve seen some of your other posts and you provide very knowledgeable insights. I’m studying the two cards you suggested but am not there yet. My goal is to abstract the code from the actual camera names and count so if I add or change a camera there is no code to change. It is easy to do in visual basic or even with my rudimentary js skills. A a more detailed description of where I am:
I created a drop down text helper input_select.camera_list but did not populate the dropdown options. I then trigger an action when ha is started to populate the drop down with the camera friendly names which works fine:
alias: "set camera names on startup"
id: set-camera-names
triggers:
- trigger: homeassistant
event: start
actions:
- action: input_select.set_options
target:
entity_id: input_select.camera_list
data:
options: "{{ states.camera | map(attribute='name') | list }}"
Then I created a piece of code to execute when a selection is made in the drop down to compare the friendly names to the drop sown selected and get the camera entity_id (I included this snippet above without context):
{% set ns = namespace(id_var = 'test') %}
{% for state in states.camera %}
{% if state.name == states.input_select.camera_list.state %}
{% set ns.id_var = state.entity_id %}
{% endif %}
{% endfor %}
What I haven’t figured out is exactly where to place the for / if code in a card or template and how to have the camera entity_id recognize the string I stored in ns.var_id.
type: custom:advanced-camera-card
camera:
camera_entity: ???help!???
Thanks much for your help as well as the rest of the community. I think I’m close.
My long arduous journey is complete. Thanks to Ildar_Gabdulling for all the help and patient support. If I’d read his suggestions more carefully this may have been easier. Of significant help was a suggestion by Ildar_G to use a markdown card to troubleshoot. Doing this allowed me to see the output of my js templates. I could see if some code produced the wrong or undefined results, and if an object was returned instead of a string.
My goal was to automate discovery of the devices installed on my system and to avoid hard coding names. This solution finds all the objects in a given domain and lets me choose which one to display.
What I’ve ended up with is a method of using a minimize the space used up on a dashboard by selecting what a card is displaying. I did it primarily to allow me to choose which of my cameras would display on my main dashboard view, but it can work for climate, or groups of sensors.
There are three components:
- An automation script to load a drop down input_select with the device names / friendly names.
- A template using config-template-card that uses grabs all the domains (the domain is hard coded), then chooses the one that matches the drop down selection.
- An automation that on a state change of the drop down reloads the dashboard so the card will reload and display the selected entity. It will not do this dynamically as the card needs to reload to re-run the template. This requires loading browser-mods through HACS.
The following is for my cameras which are connected to a physical NVR.
- First create an input_select helper, what is loaded in the Options will be overwritten by the below:
- alias: "set camera names on startup"
id: set-camera-names
triggers:
- trigger: homeassistant
event: start
actions:
- action: input_select.set_options
target:
entity_id: input_select.camera_list
data:
options: "{{ states.camera | map(attribute='name') | list }}"
2, Next the card with the template, this is javascript.
type: custom:config-template-card
entities: states['input_select.camera_list']
variables:
in_sel: states['input_select.camera_list'].state
cam_sel_1: |-
Object.keys(states)
.filter(k => k.startsWith('camera'))
.filter(k => states[k]
.attributes['friendly_name'] ===
in_sel)
card:
type: custom:mod-card
style: |
ha-card {border: 2px solid red;}
card:
type: vertical-stack
title: Camera Select
cards:
- type: custom:mushroom-select-card
entity: input_select.camera_list
- type: custom:advanced-camera-card
cameras:
- camera_entity: ${String(cam_sel_1)}
- Finally I set up to trigger browser-mod:refresh on a state change of my input select. I used Node Red for this using the events: state node for the trigger and the action to call browser_mod:refresh.
Hurray!