Webpart行动态字体颜色。 [英] Webpart row font color dynamically.

问题描述

我在内容搜索Webpart中有一个字段截止日期（包含日期和时间）。 

i have a field Due date(with date and time) in Content search Webpart . 

在Webpart中，我想显示红色的行当duedate时间小于当前时间和今天的日期？

In the Webpart i want to Display the row with red Color marked when the duedate time is less than current time and today's date ?

< tr>

<tr>

< td class =" ms-cellstyle ms-vb2">

<td class="ms-cellstyle ms-vb2">

&NBSP; VAR taskDueDateProp = $ getItemValue（CTX，" customDueDate"）;

&NBSP;&NBSP;&NBSP;&NBSP;&NBSP;&NBSP;&NBSP;&NBSP;&NBSP;&NBSP;&NBSP; VAR taskDueDate = QUOT;英寸;

  var taskDueDateProp = $getItemValue(ctx, "customDueDate");
            var taskDueDate = "";

&NBSP;如果（taskDueDateProp&安培;&安培; taskDueDateProp.value）{

&NBSP;&NBSP;&NBSP ;&NBSP;&NBSP;&NBSP;&NBSP;&NBSP;&NBSP;&NBSP;&NBSP;&NBSP;&NBSP;&NBSP;&NBSP; VAR parsedTaskDueDate =新日期（taskDueDateProp.value）;

&NBSP;&NBSP;&NBSP;&NBSP;&NBSP;&NBSP;&NBSP;&NBSP;&NBSP;&NBSP;&NBSP;&NBSP;&NBSP;&NBSP;&NBSP; taskDueDate = parsedTaskDueDate.format（QUOT; DD.MM.YYYY HH：MM"）;

 if(taskDueDateProp && taskDueDateProp.value){
                var parsedTaskDueDate = new Date(taskDueDateProp.value);
                taskDueDate = parsedTaskDueDate.format("dd.MM.yyyy HH:mm");

< / TD>

</td>

< / tr>

</tr>

谢谢。

推荐答案

您好，

您可以使用JSLink实现此目的：

You can achieve this using JSLink:

<script type="text/javascript">
colorCodeRows();
function colorCodeRows() {

    SPClientTemplates.TemplateManager.RegisterTemplateOverrides({
        OnPostRender: function (ctx) {

            // get today's date
            var today = new Date();
            var rows = ctx.ListData.Row;
            for (var i = 0; i < rows.length; i++) {

                // get the date set in your date YourDateField
                var itemDate = new Date(rows[i]['testduedate']);
                console.log(itemDate);
                var rowId = GenerateIIDForListItem(ctx, rows[i]);
                var row = document.getElementById(rowId);

                if (itemDate < today) {
                    row.style.backgroundColor = '#ED9898';
                }
            }
        }
    });
}

</script>

以下是供您参考的相同帖子：

Here is a same thread for your reference:

https://sharepoint.stackexchange.com/questions/177564/change-the-color-of-a-row-when -date-todays-date

谢谢

最好的问候

这篇关于Webpart行动态字体颜色。的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！