0

私のページには、ドロップダウン(選択)とテーブルがあり、どちらもビューモデルにバインドされています。ドロップダウンを変更すると、選択範囲内のそのアイテムに関連付けられているデータでテーブルが更新されます。

テーブルにデータが入力された後、テーブルに対してUI処理を実行したいと思います。ドロップダウン選択をサブスクライブしようとしましたが(これは起動され、関数が呼び出されます)、サブスクライブが完了するとテーブルデータが更新されます。

私がやりたいのは、次のような単純な関数を使用して、テーブルの背景行の色を更新することです。

updateRowBgColors = function (tableId) {
    $("#" + tableId + " tr:gt(0):odd").css("background-color", "#f7f7f7");
    $("#" + tableId + " tr:gt(0):even").css("background-color", "#fff");
};

はい、htmlのデータバインディングで行を交互に配置するためのクラスを設定できることは知っていますが、これが機能しない理由についての私の質問には答えられません。

4

1 に答える 1

4

foreach バインディングと共に afterRender バインディングを使用できます。

<table>
    <tbody data-bind="foreach: {data: people, afterRender: doYourThing}">
        <tr>
            <td data-bind="text: Name"></td>
            <td data-bind="text: Number"></td>
        </tr>
    </tbody>
</table>

そしてあなたのビューモデルで:

self.doYourThing = function(insertedDomElementArray, dataItem) {
    $('tr:odd').css("background-color", "#f7f7f7");
    $('tr:even').css("background-color", "#fff");
};

フィドル

于 2012-08-18T07:49:01.310 に答える