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

时间:2011-03-28 19:41:39

标签: jquery css datatables

我正在尝试根据日期范围更改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(); });

1 个答案:

答案 0 :(得分:1)

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

var tr = oTable.fnGetNodes(iDataIndex);
$(tr).css('background-color', '#F00');

oTable必须包含dataTable对象。

var oTable = $("#myTable").dataTable({ ... });