I am trying to change the color of Due Date when it is more than 2 days to become Red and if within 2 days Orange and less then 2 days to be Green . I have created this DueDateStatus calculated column to calculate the amount of days from the current date to the date that is set by the user in the Due Date.
The next step for me is to create a jquery that will be added a script editor with the list in the same site page. Unfortunately, this is part where I am stuck with the code or the script. It is not working as expected.
script type="text/javascript" src="https://..../../.../.../Scripts/Libraries/jquery-1.11.3.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function() {
// Customize the selector based on your HTML structure and due date column name
$("td.ms-vb2:contains('Due Date')").each(function() {
var dueDateCell = $(this);
var dueDate = new Date(dueDateCell.text());
var today = new Date();
// Customize the date comparison logic and styling based on your requirements
if (dueDate < today) {
dueDateCell.css('color', 'red');
} else {
dueDateCell.css('color', 'green');
}
});
});
</script>
What I tried so far:
- Created a calculated column and validation rule.
- Tried different script editors.
- I cannot try the same with JSON as this is SharePoint 2016 version, not the cloud based. Results I am trying to achieve: To change the color of Due Date when it is more than 2 days to become Red and if within 2 days Orange and less then 2 days to be Green.