Button that toggles entity state between two values

Hi, I’m trying to add a button to toggle between 80 and 100 for a target state of charge entity.

I have the following YAML but I don’t seem to be able to conditionally set the value. I’d really appreciate some help on where to go from here as I’m getting stuck.

type: custom:bubble-card
card_type: button
entity: number.lsjwh4099nn138458_target_soc
name: Long Journey Mode
icon: mdi:car-clock
show_state: false
show_attribute: false
force_icon: false
button_action:
  tap_action:
    action: call-service
    service: number.set_value
    service_data:
      entity_id: number.lsjwh4099nn138458_target_soc
      value: >
      {% if states.number.lsjwh4099nn138458_target_soc.state == 100 %}
          80
        {% else %}
          100
        {% endif %}
    target: {}
card_layout: large
styles: |-
  .bubble-button-background {

  background-color: ${state == '100' ? 'red' : 'blue'} !important;

    }

If I change value to 100 the action works.

A secondary issue is changing this value triggers a really slow API call so the background colour is not updated immediately, it would be great if I could initiate some kind of loading state until the entity updates.

Thanks!

Templates are not supported in the actions of almost all card types. You can put your templated actions in a script and call the script from the card’s action.

1 Like