根据日期范围过滤更改 jquery 数据表行的 css

Question

我正在尝试根据日期范围更改 jquery 数据表的背景颜色...我尝试使用 $.fn.afnFiltering.push(...) 进行日期范围过滤...但无法弄清楚如何更改过滤行的颜色...

这是我用来进行过滤的代码...我测试了这个并且日期范围过滤有效...

        //row filtering by date
$.fn.dataTableExt.afnFiltering.push(
function (oSettings, aData, iDataIndex) {
    var iFini = document.getElementById('dateStart').value;
    var iFfin = document.getElementById('dateEnd').value;
    if (iFini == "" && iFfin == "") {
        return true;
    }
    else if (iFini != "" && iFfin == "") {
        return true;
    }
    else if (iFini == "" && iFfin != "") {
        return true;
    }
    else if (iFini != "" && iFfin != "") {
        var sdate = new Date();
        var edate = new Date();
        var initialdt = iFini.split("/");
        var enddt = iFfin.split("/");
        var filterdt1 = aData[3].split(" ");
        var filterdt = filterdt1[0].split("/");
        var msg = "";
        if ((Number.parseInvariant(filterdt[0]) + 1 >= Number.parseInvariant(initialdt[0]) + 1 && Number.parseInvariant(filterdt[0]) + 1 <= Number.parseInvariant(enddt[0]) + 1) && (Number.parseInvariant(filterdt[1]) >= Number.parseInvariant(initialdt[1]) && Number.parseInvariant(filterdt[1]) <= Number.parseInvariant(enddt[1])) && (Number.parseInvariant(filterdt[2]) >= Number.parseInvariant(initialdt[2]) && Number.parseInvariant(filterdt[2]) <= Number.parseInvariant(enddt[2]))) {
            // msg = "initialdt: " + initialdt[0] + "/" + initialdt[1] + "/" + initialdt[2] + "====" + "enddt: " + enddt[0] + "/" + enddt[1] + "/" + enddt[2] + "====Filter:" + filterdt[0] + "/" + filterdt[1] + "/" + filterdt[2] + "/n";

                //need to change the style here...not sure how to address        
                //the individual row

            return true;
        }
    }

    return true;
}
);

我还绑定了 fnDraw 函数，如下所示...

 $("#dateStart").keyup(function () { $dTable.fnDraw(); });
 $("#dateStart").change(function () { $dTable.fnDraw(); });
 $("#dateEnd").keyup(function () { $dTable.fnDraw(); });
 $("#dateEnd").change(function () { $dTable.fnDraw(); });

Answer 1

您可以使用 iDataIndex 和 fnGetNodes 获取 tr 元素。

<代码>
var tr = oTable.fnGetNodes(iDataIndex);
$(tr).css('背景颜色', '#F00');

oTable 必须包含 dataTable 对象。

<代码>
var oTable = $("#myTable").dataTable({ ... });