12

I'm trying to dynamically set the class of a listview item template:

<div id="semanticZoomTemplate" data-win-control="WinJS.Binding.Template" style="display: none">
    <h1 class="semanticZoomItem-Text" data-win-bind="innerText:title;class:contains"></h1>
</div>

But data-win-bind fails to do anything when 'class' is present as a property-name.

Is there a correct way to styling specific items in a listview if indeed I can't change the class with data-win-bind?

Filip Skakun
  • 31,624
  • 6
  • 74
  • 100
dannyfritz
  • 396
  • 5
  • 12

1 Answers1

15

You need to set the JavaScript class property, which is not called "class", but "className".

ChristiaanV
  • 5,401
  • 3
  • 32
  • 42
  • Thanks! data-win-bind="innerText:title;className:contains" works great. – dannyfritz May 18 '12 at 15:09
  • 1
    Hi @ChristiaanV, do you know if using `class="other" data-win-bind="className:contains"` replaces the class attribute or appends the binding to the existing? – Floydian May 23 '12 at 16:44
  • By default it overrides the "other" class. I know that you can build converters, which you can add in your binding, but don't know exactly if you can build a converter that can make the class append. – ChristiaanV May 24 '12 at 06:58