数据库实现根本不起作用,Javascript / JQuery

时间:2014-12-12 12:11:37

标签: javascript jquery html css

是的,这可能是显而易见的,但对jquery / javascript来说是新手,这让我很困惑。我正在阅读教程(不起作用的位代码是jsfiddle.net/wqbd6qeL)。但这对我不起作用。现在我的html与他的眼睛相似/相同。我很确定我的问题是我是如何尝试实现他的代码的。 javascript正在运行,而css则突出显示。我是否正确实施了以下内容? (var = table位)。

哦!和条件(==“失败”)我已经测试了几种不同的方式。不等于等等但它从未突出显示任何东西:(但是css肯定是在达到。

 <script>

       //listTable 
    var lt = $(document).ready(function () {
        $('#listTable').DataTable({
            initComplete: function () {
                var api = this.api();

                api.columns().indexes().flatten().each(function (i) {
                    var column = api.column(i);
                    var select = $('<select><option value=""></option></select>')
                        .appendTo($(column.footer()).empty())
                        .on('change', function () {
                            var val = $.fn.dataTable.util.escapeRegex(
                                $(this).val()
                            );

                            column
                                .search(val ? '^' + val + '$' : '', true, false)
                                .draw();
                        });

                    column.data().unique().sort().each(function (d, j) {
                        select.append('<option value="' + d + '">' + d + '</option>')
                    });
                });
            }
        });
              $('#addbtn').click(addRow);
    });

    //no idea why this is not working??
    var table = $('#listTable').DataTable({
        fnRowCallback: function (nRow, aData, iDisplayIndex, iDisplayIndexFull) {
            if (aData[2] == "Fail") {          
                $(nRow).addClass('highlight');
            }
        }
    });

</script>

1 个答案:

答案 0 :(得分:2)

你应该把这个块放在你的评论

之下
//no idea why this is not working??

在函数内部

var lt = $(document).ready(function () {....}));

实际上你可以复制

fnRowCallback: function (nRow, aData, iDisplayIndex, iDisplayIndexFull) {
    if (aData[2] == "Fail") {          
        $(nRow).addClass('highlight');
    }
}

在行前

initComplete: function () {

并删除评论下方的所有内容..不要忘记在fnRowCallback之后添加逗号。

希望这就是你想要的。

编辑:

这是最终结果:

 <script>

       //listTable 
    var lt = $(document).ready(function () {
        $('#listTable').DataTable({
            fnRowCallback: function (nRow, aData, iDisplayIndex, iDisplayIndexFull) {
                if (aData[2] == "Fail") {          
                    $(nRow).addClass('highlight');
                }
            },            
            initComplete: function () {
                var api = this.api();

                api.columns().indexes().flatten().each(function (i) {
                    var column = api.column(i);
                    var select = $('<select><option value=""></option></select>')
                        .appendTo($(column.footer()).empty())
                        .on('change', function () {
                            var val = $.fn.dataTable.util.escapeRegex(
                                $(this).val()
                            );

                            column
                                .search(val ? '^' + val + '$' : '', true, false)
                                .draw();
                        });

                    column.data().unique().sort().each(function (d, j) {
                        select.append('<option value="' + d + '">' + d + '</option>')
                    });
                });
            }
        });
              $('#addbtn').click(addRow);
    });

</script>