Page 1 of 1
Highlight date row of more than 1 day old.
Posted: 2023-03-13 19:47
by patsd102
Hi all,
I thought I had this working.
unfortunately it's not working,
I had it in the footer page and a louth-tv.js file.
Code: Select all
$j(function(){
$j('.louth-entereddate').each(function(){
var enteredDate = new Date($j(this).text()); //fetch date value from row
var yesterday = new Date(today.getTime() - (24 * 60 * 60 * 1000)); //subtract one day from today's date
if (enteredDate < yesterday) { //compare date values
$j(this).parents('tr').addClass('warning');
}
});
});
Any help would be appreciated
Pat
Re: Highlight date row of more than 1 day old.
Posted: 2023-03-14 21:28
by pbottcher
Try
Code: Select all
var yesterday = new Date(new Date().getTime() - (24 * 60 * 60 * 1000));
instead of
Code: Select all
var yesterday = new Date(today.getTime() - (24 * 60 * 60 * 1000));
Re: Highlight date row of more than 1 day old.
Posted: 2023-03-14 21:57
by patsd102
Re: Highlight date row of more than 1 day old.
Posted: 2023-03-14 23:09
by baudwalker
Code: Select all
var Today = new Date();
var Yesterday = new Date();
Yesterday.setDate(Today.getDate()-1);
Re: Highlight date row of more than 1 day old.
Posted: 2023-03-15 17:42
by patsd102
HI,
I added your code.
Still not working,
Code: Select all
$j(function(){
$j('.louth-entereddate').each(function(){
var Today = new Date();
var Yesterday = new Date();
if Yesterday.setDate(Today.getDate()-1);
$j(this).parents('tr').addClass('warning');
}
});
});
Re: Highlight date row of more than 1 day old.
Posted: 2023-03-15 20:15
by pbottcher
Hi,
yo have 2 issues, first you did not put the code correctly.
In your code you have
Code: Select all
$j(function() {
$j('.louth-entereddate').each(function() {
var entereddate = new date($j(this).text());
var yesterday = new date(new date().getTime() - (24 * 60 * 60 * 1000));
if (entereddate < yesterday) {
$j(this).parents('tr').addClass('warning');
}
});
});
But it should be
Code: Select all
$j(function() {
$j('.louth-entereddate').each(function() {
var entereddate = new Date($j(this).text());
var yesterday = new Date(new Date().getTime() - (24 * 60 * 60 * 1000));
if (entereddate < yesterday) {
$j(this).parents('tr').addClass('warning');
}
});
});
Watch the Date instead the date !
Next, your date is not a datestring that can be converted from js directly.
So in your case you can try
Code: Select all
$j(function() {
$j('.louth-entereddate').each(function() {
var d = $j(this).text().split("/");
entereddate = new Date(d[2] + '/' + d[1] + '/' + d[0]);
var yesterday = new Date(new Date().getTime() - (24 * 60 * 60 * 1000));
if (entereddate < yesterday) {
$j(this).parents('tr').addClass('warning');
}
});
});
Re: Highlight date row of more than 1 day old.
Posted: 2023-03-16 07:49
by patsd102
Hi,
I tried the code in another website pbottcher.
Same result,
It's not working unfortunately.
Code: Select all
<script>
$j(function() {
$j('.DX27-Date').each(function() {
var d = $j(this).text().split("/");
Date = new Date(d[2] + '/' + d[1] + '/' + d[0]);
var yesterday = new Date(new Date().getTime() - (24 * 60 * 60 * 1000));
if (Date < yesterday) {
$j(this).parents('tr').addClass('warning');
}
});
</script>
Re: Highlight date row of more than 1 day old.
Posted: 2023-03-16 10:51
by jsetzer
Fortunately, AppGini ships with the awesome Moment.JS library (
https://momentjs.com/) which helps us on date-/datetime-formatting and -conversion between formats (database format/UI/locales). Additionally the moment.js functions are tested extremely good and very readable. They will work in most cultures with different language-/locale-settings by default.
Here is a good readable example with many comments which should help not only me and you but probably many here:
Code: Select all
// file: hooks/TABLENAME-tv.js
jQuery(document).ready(function() {
// configure table and column names according to your needs
const tn = "projects"; // table name
const cn = "created_on"; // column name
// Get date format configured in AppGini project settings
const d_format = AppGini.datetimeFormat('d');
// Reading configured date format instead of hardcoding
// will help you when migrating the project to different culture in the future
// get today as moment-date
const reference_date = moment(); // today
// If you need a different date for comparison than today,
// you can use the moment constructor like this:
// Just adjust your date-value AND your initial date-format
// reference_date = moment("31.12.2023", "DD.MM.YYYY");
// let moment.js calculate yesterdays date. Good readable, I think
const yesterday = reference_date.subtract(1, 'day');
// now iterate through all cells for the given column 'cn' of table 'tn'
// we don't need the table-header's <th>'s, just the table-body's <td>'s
jQuery(`td.${tn}-${cn}`).each(function(i, e) {
const td = jQuery(e); // current cell (jQuery DOM element)
const td_text = td.text(); // text of current cell (string)
const td_datevalue = new moment(td_text, d_format); // converted string to date
// this should skip empty cells or cells with invalid contents
if (td_datevalue.isValid()) {
if (td_datevalue.isSame(reference_date, 'day'))
td.closest("tr").addClass("success");
else if (td_datevalue.isSame(yesterday, 'day'))
td.closest("tr").addClass("warning");
else if (td_datevalue.isBefore(yesterday, 'day'))
td.closest("tr").addClass("danger");
}
});
});
PS: If there is anything not working as expected, I recommend checking console for errors and logging to console. I got used to always check the actual values instead of working with unknown data further on.
console.log(YOUR_VARIABLE_NAME); is one of my strongest helpers.
Re: Highlight date row of more than 1 day old.
Posted: 2023-03-16 20:02
by pbottcher
Hi,
just to add, if you change the code, please consider how you change it.
In your code you have
Date = new Date(d[2] + '/' + d[1] + '/' + d[0]);
which causes the error. Use entereddate instead of Date and it should work.
Re: Highlight date row of more than 1 day old.
Posted: 2023-03-24 21:56
by patsd102
Perfect. Many thanks.
The fuel price's in my town are massive.
So, It's good to show where the best value is.
Pat
