thomasloven / lovelace-template-entity-row

🔹 Display whatever you want in an entities card row.
MIT License
210 stars 16 forks source link

input_select not rendered as dropdown #70

Open nottledim opened 2 years ago

nottledim commented 2 years ago

In an entity card if I have the following the choices are presented as a dropdown list:

           - entity: input_select.charge_rate

If I use template entity row it just displays current selection but doesn't offer the dropdown list for selection:

           - type: 'custom:template-entity-row'
             entity: input_select.charge_rate
rbnmk commented 2 years ago

@nottledim did you find a solution/workaround for your issue?

I have the same issue, I am creating a dashboard that will help me start playing music throughout the house. I have the luxury of having Google Chromecast & Sonos speakers (/sigh) so I am trying to determine with a input select which type of speaker(s) I will be targetting for the action. This custom type card seems promising if this could be fixed.

example: 2021-12-08_14h59_52

nottledim commented 2 years ago

Nice demonstration! No, in answer to your question. You can select it from the entity settings popup as you show but that's not ideal.

calisro commented 2 years ago

Couldn't you wrap that input_select in a hui-element?

https://github.com/thomasloven/lovelace-hui-element

calisro commented 2 years ago

Like this:

type: entities
entities:
  - type: 'custom:template-entity-row'  
    entity: input_select.pool_light_select
  - type: custom:hui-element  
    card_type: entities
    entities: 
      - input_select.pool_light_select

The reason it doesn't render normally is because it is an 'entity' row. If you use a 'entity' card, you'll notice the same behavior. Notice I am using 'entities'.

type: entity
entity: input_select.pool_light_select

That will render showing the state which is exactly what the template card is doing. It isn't a bug.

In an entity card if I have the following the choices are presented as a dropdown list:

           - entity: input_select.charge_rate

This isn't in a entity card. It is in a entities card. In the entity card it will show just the state.

nottledim commented 2 years ago

Interesting, I was unaware of hui-element. It doesn't really help; I use template-entity-row mostly for it's conditional feature. Without that I would use a normal entities row. However if I do use hui-element it creates a nested entities card which effectively indents the rows (icons don't line up). It doesn't seem to play with template-entity row either. So I don't really see the point of it (hui-element) in this situation.

nottledim commented 2 years ago

These are 4 variants I've tried, all rows in an entities card:

  - entity: input_select.charge_rate
    name: Charge Rate A

  - type: 'custom:template-entity-row'
    entity: input_select.charge_rate
    name: Charge Rate B
#    condition: '{{ not is_state(''binary_sensor.i3_120_connection_status'', ''off'') }} '

  - type: custom:hui-element
    card_type: custom:template-entity-row
    entity: input_select.charge_rate
    name: Charge Rate C
#    condition: '{{ not is_state(''binary_sensor.i3_120_connection_status'', ''off'') }} '

  - type: custom:hui-element
    card_type: entities
    entities:
      - entity: input_select.charge_rate
        name: Charge Rate D

The condition statements are commented so the row renders.
A: renders a dropdown, B&C render the same but no dropdown, and D renders a dropdown but is indented.

I'm open to suggestions for more ways to do this :-)

calisro commented 2 years ago

You could use card_mod to change the padding for D and line them back up.

type: entities
entities:
  - entity: input_select.pool_light_select
    name: Charge Rate A
  - type: custom:template-entity-row
    entity: input_select.pool_light_select
    name: Charge Rate B
  - type: custom:hui-element
    card_type: custom:template-entity-row
    entity: input_select.pool_light_select
    name: Charge Rate C
  - type: custom:hui-element
    card_type: entities
    style: |
      .card-content {
        padding: 0
      }
    entities:
      - entity: input_select.pool_light_select
        name: Charge Rate D

For your examples, you don't really need to use the custom card though. Unless you have more complex conditions requiring the templates?

type: entities
entities:
  - entity: input_select.pool_light_select
    name: Charge Rate A

  - type: custom:template-entity-row
    entity: input_select.pool_light_select
    name: Charge Rate B

  - type: custom:hui-element
    card_type: custom:template-entity-row
    entity: input_select.pool_light_select
    name: Charge Rate C

  - entity: binary_sensor.i3_120_connection_status
  - type: conditional
    conditions:
      - entity: binary_sensor.i3_120_connection_status
        state_not: on
    row: 
      entity: input_select.charge_rate
ildar170975 commented 2 years ago

@nottledim

  • type: custom:hui-element card_type: custom:template-entity-row entity: input_select.pool_light_select name: Charge Rate C

This will not work definitely. I guess the hui-element only accepts conventional cards/rows.

ildar170975 commented 2 years ago

@nottledim

If I use template entity row it just displays current selection but doesn't offer the dropdown list for selection:

What was the final goal? Why do you need the input_select inside the template-entity-row?

nottledim commented 2 years ago

Thanks for all the suggestions. @calisro setting "padding: 0" works but has to be applied to the input_select not the entity:

  - type: custom:hui-element
    card_type: entities
    entities:
      - entity: input_select.charge_rate
        name: Charge Rate D
        style: |
          .card-content {
          padding: 0
          }

However your other suggestion is neater and does exactly what I want:

  - type: conditional
    conditions:
      - entity: binary_sensor.i3_120_connection_status
        state_not: 'off'
    row:
      entity: input_select.charge_rate
      name: Charge Rate E

Many thanks for that. It's been a great help.

@ildar170975 Why do you need the input_select inside the template-entity-row? Because I want to display only when charging and template-entity-row has that feature. Now I know there's another way - live and learn!

ildar170975 commented 2 years ago

Because I want to display only when charging and template-entity-row has that feature.

Then you may use these options:

Example:

type: entities
entities:
  - input_boolean.test_boolean
  - type: custom:state-switch
    entity: input_boolean.test_boolean
    states:
      'on':
        type: custom:hui-element
        row_type: sensor-entity
        entity: sun.sun
      'off':
        type: custom:hui-element
        row_type: sensor-entity
        entity: sun.sun

Compare with:

type: entities
entities:
  - input_boolean.test_boolean
  - entity: sun.sun
    card_mod:
      style: |
        :host {
          {% if is_state('input_boolean.test_boolean','on') %}
          display: none !important;
          {% endif %}
        }
  - entity: sun.sun
    card_mod:
      style: |
        :host {
          {% if is_state('input_boolean.test_boolean','off') %}
          display: none !important;
          {% endif %}
        }

and

type: entities
entities:
  - input_boolean.test_boolean
  - type: conditional
    conditions:
      - entity: input_boolean.test_boolean
        state: 'on'
    row:
      entity: sun.sun
  - type: conditional
    conditions:
      - entity: input_boolean.test_boolean
        state: 'off'
    row:
      entity: sun.sun

conditional-row ----- card-mod ----- state-switch ----- simple card with 2 fixed rows cond