Search number between range

[pedrochaves86]

Hello guys,

I'm trying to implement a advanced search field in a column where it returns the results between two given inputs:

<input type="number" placeholder="From" #inputField1 style="width:150px">
<input type="number" placeholder="To" #inputField2 style="width:150px">
<button class="btn-primary" type="button" (click)="amountRange(inputField1.value, inputField2.value)">GO</button>

 amountRange(beginValue: string, endValue: string){
    if(!beginValue && !endValue){
      this.source = new LocalDataSource(this.data);
    }else{
      this.source.addFilter([
        {
          field: 'amount',
          search: [beginValue, endValue],
          filter:{

          }
        }
      ], false);
    }
  }

Any ideias how to implement filter function? Thanks :)

[filipe-nunes]

Hey @pedrochaves86 if you ever come up with a solution, please share it 👍 thanks!

[pedrochaves86]

Solution:

if(!beginValue && !endValue){
      this.source = new LocalDataSource(this.data);
    }else{
      this.source.setFilter([
        {
          field: 'amount',
          search: beginValue,
          filter: (value: number, beginValue: number) =>{
            return +value >= +beginValue;
          }
        },
        {
          field: 'amount',
          search: endValue,
          filter: (value: number, endValue: number) =>{
            return +value <= +endValue;
          }
        }
      ]);
    }

[shilan]

Now that you found the solution to this, what happens to the filterFunction(cell: any, search?:string) ? I mean what about the third parameter?

[shilan]

I actually found a better solution inspired by your code that guarantees we get to both filters and that is filtering on return value of a filter here it is

`  dateRange(beginDate: string, endDate: string) {
    if (!(!beginDate && !endDate)) {
        this.source.setFilter([
          {
            field: 'batchDateAsString',
            search: endDate,
            filter: (value: string, endValue: string) => {
              return new Date(value) <= new Date(endValue);
            }
          }
        ], true).setFilter([
          {
            field: 'batchDateAsString',
            search: beginDate,
            filter: (value: string, beginValue: string) => {
              return new Date(value) >= new Date(beginValue);
            }
          }
        ]);
    } else {
      this.source = new LocalDataSource(this.data);
    }
  }`

[Anujmoglix]

Thanks .work for me as well. I want one more filter like column will not show in the list but i can filter the data based on input . is it possible here?

[felipealmeida948]

Solution:

if(!beginValue && !endValue){
      this.source = new LocalDataSource(this.data);
    }else{
      this.source.setFilter([
        {
          field: 'amount',
          search: beginValue,
          filter: (value: number, beginValue: number) =>{
            return +value >= +beginValue;
          }
        },
        {
          field: 'amount',
          search: endValue,
          filter: (value: number, endValue: number) =>{
            return +value <= +endValue;
          }
        }
      ]);
    }

I am trying to implement this code, but it is applying the second filter only

[DidierBoutin]

search can be a tab; so you can initialize parameters in one shot :

  this.source.setFilter([
    {
      field: 'amount',
      search: ['2010-01-01' ,  '2015-01-01']
      filter: (value: string, serachValue: string) =>{
      return (new Date(value) >= new Date(searchValue[0]) && (new Date(value) <= new Date(searchValue[1])) )
      }
  }])

[MRROOX]

search can be a tab; so you can initialize parameters in one shot :

  this.source.setFilter([
    {
      field: 'amount',
      search: ['2010-01-01' ,  '2015-01-01']
      filter: (value: string, serachValue: string) =>{
      return (new Date(value) >= new Date(searchValue[0]) && (new Date(value) <= new Date(searchValue[1])) )
      }
  }])

This works for me, and for my ng2-smart-table. Thank you!

Following this example, I implemented this method.

dateRange(beginDate: string, endDate: string) {
    this.source = new LocalDataSource(this.data);
      this.source.setFilter([
        {
          field: 'createdAt',
          search: [beginDate ,  endDate],
          filter: (value: string, searchValue: string) =>{
             console.log('FILTER END DATE:  value:' + value + ', endValue :' + searchValue[0]);
             console.log('FILTER BEGIN DATE: value:' + value + ', endValue :' + searchValue[1]);
          return (new Date(value) >= new Date(searchValue[0]) && (new Date(value) <= new Date(searchValue[1])) )
          }
      }]);
} 

[lavdrimb]

I tried every single code you posted here but none of them worked alone, so I mixed some features of some codes here and another code from StackOverflow and I finally have exact results on every search my only problem is I cant trigger this function from the outside, the function is triggered only if I write something in column filter start: { title: 'Start', type: 'Date', filterFunction: (value: any, search?: string) =>{ return (new Date(value) >= new Date(this.startDate) && (new Date(value) <= new Date(this.endDate)) ) },