NJ44 Ответов: 0

Привязка Css не работает в knockout JS


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?


Что я уже пробовал:

Я пытался разместить метод "isSelectable" в различных других местах, но ничто, казалось, не связывало этот метод с строкой selectablematch tr.

0 Ответов