Highlight date row of more than 1 day old.

Discussions related to customizing hooks. Hooks are documented at http://bigprof.com/appgini/help/advanced-topics/hooks/
Post Reply
patsd102
Veteran Member
Posts: 142
Joined: 2013-01-15 19:59

Highlight date row of more than 1 day old.

Post by patsd102 » 2023-03-13 19:47

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
23.17

pbottcher
AppGini Super Hero
AppGini Super Hero
Posts: 1635
Joined: 2018-04-01 10:12

Re: Highlight date row of more than 1 day old.

Post by pbottcher » 2023-03-14 21:28

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));
Any help offered comes with the best of intentions. Use it at your own risk. In any case, please make a backup of your existing environment before applying any changes.

patsd102
Veteran Member
Posts: 142
Joined: 2013-01-15 19:59

Re: Highlight date row of more than 1 day old.

Post by patsd102 » 2023-03-14 21:57

23.17

User avatar
baudwalker
Veteran Member
Posts: 188
Joined: 2015-02-03 08:08
Location: Bellingen NSW Australia

Re: Highlight date row of more than 1 day old.

Post by baudwalker » 2023-03-14 23:09

Code: Select all

var Today = new Date();
var Yesterday = new Date();

Yesterday.setDate(Today.getDate()-1);

patsd102
Veteran Member
Posts: 142
Joined: 2013-01-15 19:59

Re: Highlight date row of more than 1 day old.

Post by patsd102 » 2023-03-15 17:42

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');
        }
    });
});
23.17

pbottcher
AppGini Super Hero
AppGini Super Hero
Posts: 1635
Joined: 2018-04-01 10:12

Re: Highlight date row of more than 1 day old.

Post by pbottcher » 2023-03-15 20:15

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');
            }
        });
    });
Any help offered comes with the best of intentions. Use it at your own risk. In any case, please make a backup of your existing environment before applying any changes.

patsd102
Veteran Member
Posts: 142
Joined: 2013-01-15 19:59

Re: Highlight date row of more than 1 day old.

Post by patsd102 » 2023-03-16 07:49

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>
23.17

User avatar
jsetzer
AppGini Super Hero
AppGini Super Hero
Posts: 1807
Joined: 2018-07-06 06:03
Location: Kiel, Germany
Contact:

Re: Highlight date row of more than 1 day old.

Post by jsetzer » 2023-03-16 10:51

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.
Kind regards,
<js />

My AppGini Blog:
https://appgini.bizzworxx.de/blog

You can help us helping you:
Please always put code fragments inside [code]...[/code] blocks for better readability

AppGini 24.10 Revision 1579 + all AppGini Helper tools

pbottcher
AppGini Super Hero
AppGini Super Hero
Posts: 1635
Joined: 2018-04-01 10:12

Re: Highlight date row of more than 1 day old.

Post by pbottcher » 2023-03-16 20:02

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.
Any help offered comes with the best of intentions. Use it at your own risk. In any case, please make a backup of your existing environment before applying any changes.

patsd102
Veteran Member
Posts: 142
Joined: 2013-01-15 19:59

Re: Highlight date row of more than 1 day old.

Post by patsd102 » 2023-03-24 21:56

Perfect. Many thanks.
The fuel price's in my town are massive.
So, It's good to show where the best value is.

Pat

Image
23.17

Post Reply