Hi All, I am new to Knockout JS, therefore need your help to fix one small issue. I am trying to bind css style with a table row in CSHTML page, based on a condition. I have added 2 rows but displaying only one for each item using 'visible' attribute. Following is my cshtml code: <table class="listing"> <tbody class="no-wrap" data-bind="foreach: searchResultsListing.pagedItems, select: searchResultsListing"> <tr class="selectable" data-bind="visible: !$root.isMatchedCase($data), css: { selected: $root.searchResultsListing.isSelected($data) }"> <td class="check"><span></span></td> -- -- <tr/> <tr class="selectablematch" data-bind="visible: $root.isMatchedCase($data), css: { selected: $root.searchResultsListing.isSelected($data) }"> <td class="check"><span></span></td> -- -- <tr/> Underlying Typescript: Inside app.listing.ts File: isSelected(item: T) { return this.selectedItems.indexOf(item) >= 0; } As you can see, based on the result of isMatchedCase() method (which returns a boolean), I am displaying either of the tr (selectable or selectablematch). The problem is the css on the tr is getting binded only for the first tr, i.e. with the class selectable, and not getting binded with the selectablematch tr. The method 'isSelected($data)' is not getting called when the checkbox in the first td is clicked for 'selectablematch' tr. Can you guys please let me know what I am missing here?
var
This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)