Js template wont work on Lovelace Button card


using this template for my buttons works on all entity.states, except 1.

        entity_picture_template: >
          return '/local/tiles/family/name_' + entity.state.toLowerCase().replace(' ','_') + '.png';

the state of the entity is (zone.) zwembad_de_stok while the zone is Zwembad de Stok. I’ve made the template to replace spaces with an underscore, and capitals to lovercase. Works everywhere in the button setup.

The inspector unfortunately shows the last underscore isn’t added…Shouldn’t this template replace all spaces with an underscore?

<paper-button tabindex="0" id="component_5" class="off" style="--tiles-background: url("/local/tiles/family/name_zwembad_de stok.png"); --tiles-list-color: url("/local/tiles/family/name_zwembad_de stok.png"); background-color: rgb(100, 58, 172);"></paper-button>

using the exact same template works fine in custom-tiles, so I know the syntax is correct. with the final underscore added

      background: >
        return 'url(\"/local/tiles/family/name_' + state.toLowerCase().replace(' ','_') + '.png\")';

Must be the button card then?

Replace only replaces the first instance.

See here

@RomRider, Button-card dev, solved it for me in the Button thread Lovelace: Button card

the g parameter needs to be used:

entity_picture_template: >
          return '/local/tiles/family/name_' + entity.state.toLowerCase().replace(/ /g, '_') + '.png';

as is explained in your link too. Must admit its a bit difficult to decipher now and then :wink:

anyways, thanks for chiming in!
I’ll mark it solved.