与 JQuery 共享点 - 单击列过滤器时停止工作

问题描述:

我使用的代码为共享点列表中的项目行着色.当我过滤列表视图中的一列时 - JQuery 停止工作......我需要向代码中添加什么或以不同的方式编写?

I'm using a code that color the row of an item in a sharepoint list. when I'm filtering one of the columns in the list view - the JQuery stops working... what do I need to add to the code or write differently ?

<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.10.0/jquery.min.js"></script>
<script type="text/javascript">
    $(document).ready(function () {
        $Text = $("td.ms-cellstyle.ms-vb2:contains('Approved')"); $Text.parent().css("background-color", "#01DF3A");
        $Text = $("td.ms-cellstyle.ms-vb2:contains('Rejected')");
        $Text.parent().css("background-color", "#F90101");
        $Text = $("td.ms-cellstyle.ms-vb2:contains('Pending')");
        $Text.parent().css("background-color", "#EAC117");
    });
</script>

'$(document).ready' 函数只会在页面加载时运行一次.

The '$(document).ready' function will only run once on page load.

过滤时,您正在重新创建表格内的 HTML 元素.因此,您的 jQuery 代码永远不会在这些新的 HTML 元素上运行.

When you filter you are recreating the HTML elements inside your table. Because of this your jQuery code never runs on these new HTML elements.

在执行过滤和页面加载后,您需要调用函数以按状态为单元格着色.

You will need to call your function to color the cells by status after you do the filtering as well as on page load.

    $(document).ready(function () {
        colorCellsByStatus();
    });

    var colorCellsByStatus = function() {
        $Text = $("td.ms-cellstyle.ms-vb2:contains('Approved')");
        $Text.parent().css("background-color", "#01DF3A");
        $Text = $("td.ms-cellstyle.ms-vb2:contains('Rejected')");
        $Text.parent().css("background-color", "#F90101");
        $Text = $("td.ms-cellstyle.ms-vb2:contains('Pending')");
        $Text.parent().css("background-color", "#EAC117");
    }