Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
270
Filtering on a date column in an igx-grid
posted

Hi,

I'm having a difficult time using IgxDateFilteringOperand on a date column for rows in an igx-grid.  Can you provide me a few examples of filtering on date = today and date = tomorrow.

Thanks,

JK

  • 80
    Offline posted

    Hi,

    Thank you for contacting us!

    We will get back to you as soon as possible.

    Thank you for your patience and happy holidays!

    Best regards,

    Hristo

  • 21675
    Offline posted

    Hello Jeff,

    In order to add several date filtering condition to a grid column you should create filtering expression tree. Here is what you need to do:

    First create your start and end date conditions like this:

    const startDate = new Date(2012,1,2);
    const startDateCondition = IgxDateFilteringOperand.instance().condition('after');
    const startDateExpression = {
         condition: startDateCondition,
         fieldName: "OrderDate",
         searchVal: startDate
    };
    
    const endDate = new Date(2018,1,2);
    const endDateCondition = IgxDateFilteringOperand.instance().condition('before');
    const endDateExpression = {
         condition: endDateCondition,
         fieldName: "OrderDate",
         searchVal: endDate
    };

    Then create filtering expression tree for your date column, where these two conditions will be added and add both conditions:

    const dateFilteringExpressionsTree = new FilteringExpressionsTree(FilteringLogic.And, "OrderDate");
    dateFilteringExpressionsTree.filteringOperands.push(startDateExpression);
    dateFilteringExpressionsTree.filteringOperands.push(endDateExpression);

    Finally create expression tree for your grid and add to its filtering operands date filtering expression tree:

    const gridFilteringExpressionsTree = new FilteringExpressionsTree(FilteringLogic.And);
    gridFilteringExpressionsTree.filteringOperands.push(dateFilteringExpressionsTree);

    To apply this filter set the grid filtering expression tree to your grid:

    this.grid1.filteringExpressionsTree = gridFilteringExressionsTree;

    Please let me know if this answer your question or if you need any further assistance on this matter.

    Sincerely,
    Milko
    Software Developer