Knockoutjs - Set CSS class based on value in array - css

Question

here is the html table I am working on:
<tbody data-bind="foreach: xusers.list">
<tr data-bind="css:{'approved-false' : member()==1 }">
<td data-bind="text: member"></td>
<td data-bind="text: expired"></td>
<td data-bind="text: name"></td>
<td data-bind="text: email"></td>
</tr>
</tbody>
The value of the array item member displays in the table just fine but my css call is not working no matter what syntax I have tried. I just want to apply this class if member is true (member contains either 1 or 0).
What am I missing?
Additional Code - Am I overwriting observable?...Here is the only place anything is written to the array.
if (!data) {
...
}
else {
if (data.length) {
var curItem;
for (var i=0; i<data.length; i++) {
curItem = new xuser();
curItem.name = data[i].name;
curItem.email = data[i].email;
curItem.city = data[i].city;
curItem.region = data[i].region;
curItem.country = data[i].country;
curItem.expires = data[i].expires;
curItem.member = data[i].member;
curItem.expired = data[i].expired;
xusers.list.push(curItem)
totalRecs = data[i].TotalCount;
}
}
} // if (!data)/else

Answer 1

You were close, just had it backward: see http://knockoutjs.com/documentation/css-binding.html
<tbody data-bind="foreach: xusers.list">
<tr data-bind="css:{'approved-false': member() == 1 }">
<td data-bind="text: member"></td>
<td data-bind="text: expired"></td>
<td data-bind="text: name"></td>
<td data-bind="text: email"></td>
</tr>
</tbody>
You are also overwriting your observables, see below (this assumes that all fields on curItem are observables, update your own as needed):
if (!data) {
...
}
else {
if (data.length) {
var curItem;
for (var i=0; i<data.length; i++) {
curItem = new xuser();
curItem.name(data[i].name);
curItem.email(data[i].email);
curItem.city(data[i].city);
curItem.region(data[i].region);
curItem.country(data[i].country);
curItem.expires(data[i].expires);
curItem.member(data[i].member);
curItem.expired(data[i].expired);
xusers.list.push(curItem)
// this should probably be somewhere else
totalRecs = data[i].TotalCount;
}
}
} // if (!data)/else