Author Topic: Working with unix/epoch timestamps  (Read 5512 times)

webifi

  • Pro Deluxe
  • Newbie
  • *
  • Posts: 45
    • View Profile
Working with unix/epoch timestamps
« on: December 05, 2014, 03:18:01 am »
I'm working with date columns that are in unix time stamps (ms since epoch).

Getting them to display as string/formatted dates is easy enough with a render function, but I'm having trouble creating a local header filter using a datePicker.

Other than using a string/formatted date, what options do I have?


paramvir

  • Administrator
  • Hero Member
  • *****
  • Posts: 6092
    • View Profile
Re: Working with unix/epoch timestamps
« Reply #1 on: December 06, 2014, 09:12:40 am »
Solution to your use case is similar to the post here:

http://paramquery.com/forum/index.php?topic=678.msg3814#msg3814

you need to implement custom filter listener.

Please let know if you need further assistance.

webifi

  • Pro Deluxe
  • Newbie
  • *
  • Posts: 45
    • View Profile
Re: Working with unix/epoch timestamps
« Reply #2 on: December 11, 2014, 09:04:25 pm »
Thanks.

One issue I'm having is that the text dates in the filter fields disappear after sorting the column (clicking on the column titles to change the sort order).  The filter still stays in place, but the textual representation of them disappears from the filter text boxes.

Code: [Select]
var _pqDateFilter = function(ui) {
        var $this = $(this);
        $this.css({zindex:9999,position:"relative"}).datepicker({changeYear:true, changeMonth: true, onClose:function(evt,ui){$(this).focus()}});
        $this.filter(".pq-from").datepicker("option","defaultDate", new Date("01/01/2001"));
        $this.filter(".pq-to").datepicker("option","defaultDate", new Date());
    }   

filter: {
                type: 'textbox',
                condition: 'between',
                init: _pqDateFilter,
                listeners: [{
                        'change':function(evt, ui){
                            ui.value = new Date(ui.value).getTime();
                            ui.value2 = new Date(ui.value2).getTime();
                            var $grid = $(this).closest('.pq-grid');
                            $grid.pqGrid("filter", {
                                oper: 'add',
                                data: [ui]
                            })
                        }
                }]
            }


« Last Edit: December 11, 2014, 09:12:03 pm by webifi »

paramvir

  • Administrator
  • Hero Member
  • *****
  • Posts: 6092
    • View Profile
Re: Working with unix/epoch timestamps
« Reply #3 on: December 12, 2014, 05:22:00 pm »
Could you please post a small example of the issue faced by you in jsfiddle.

webifi

  • Pro Deluxe
  • Newbie
  • *
  • Posts: 45
    • View Profile
Re: Working with unix/epoch timestamps
« Reply #4 on: December 12, 2014, 09:38:17 pm »
See:
http://jsfiddle.net/b6b710mz/27/

- Set date filter to 01/01/2013 through  12/31/2014.
- Notice the filtered results.
- Now click the header for any column to sort the grid.
- Notice the data is still filtered, as expected, but the date filter text boxes are now empty.

webifi

  • Pro Deluxe
  • Newbie
  • *
  • Posts: 45
    • View Profile
Re: Working with unix/epoch timestamps
« Reply #5 on: December 12, 2014, 09:41:25 pm »
I should add:

I also can't figure out an easy way to clear the custom date filter once set.

paramvir

  • Administrator
  • Hero Member
  • *****
  • Posts: 6092
    • View Profile
Re: Working with unix/epoch timestamps
« Reply #6 on: December 15, 2014, 11:45:19 pm »
In your case, date is being stored as timestamp in the filter values, you need to reformat the date as mm/dd/yy or yy-mm-dd in column.filter.init before applying defaultDate option of datepicker ( otherwise datepicker clears the textbox values ) as

Code: [Select]

               var filter = ui.column.filter,
                   value = filter.value,
                   value = $.datepicker.formatDate('mm/dd/yy', new Date(value)),
                   value2 = filter.value2,
                   value2 = $.datepicker.formatDate('mm/dd/yy', new Date(value2));

               $this.filter(".pq-from")
                   .val(value) //change the value in 1st textbox
                   .datepicker("option", "defaultDate", new Date("01/01/2010"));

               $this.filter(".pq-to")
                   .val(value2) //change the value in 2nd textbox
                   .datepicker("option", "defaultDate", new Date());


corrected jsfiddle:

http://jsfiddle.net/b6b710mz/28/


Any filter value can be cleared by use of filter API { oper: 'replace' } or directly manipulating JSON data column.filter.value or column.filter.value2
« Last Edit: December 16, 2014, 12:27:42 am by paramquery »