Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Is it possible create a custom list filter of a column in my smart table? #1340

Closed
pj-alvarado10 opened this issue Dec 15, 2022 · 1 comment

Comments

@pj-alvarado10
Copy link

I have a list filter in a column, but the data of this list filter is not static, is dymanic and depends of the source. For example:

      myColumn: {
        title: 'My column title',
        filter: {
          type: 'list',
          config: {
            selectText: 'Select...',
            list: [
                { value: <myColumn values>, title: <myColumn values>}, //--> This list is dynamic and it is get of the server
            ],
          },
        },
      }

There are any solution?

@pj-alvarado10
Copy link
Author

In 1133 this issue was resolve for me.

In your settings:


   myColumn: {
        title: 'My column title',
        filter: {
          type: 'list',
          config: {
            selectText: 'Select...',
            list: [
                { value: "", title: "All"}
            ],
          },
        },
      }

Only you need add this lines in the function where you get your values:

this.settings.columns.myColumn.filter.config.list.push({value: columnValue.title , title: columnValue.title});
this.settings = Object.assign({}, this.settings);

For example:

  /**
   * Get the rows with the service
   */
  getRows(): void {
    this._rowsService.getRows().subscribe(
      ( response ) => { 
            this.rows = response;
            response.data.forEach( row => {
              this.settings.columns.myColumn.filter.config.list.push({value: row.myColumn , title: row.myColumn});
              this.settings = Object.assign({}, this.settings);              
            });        
      }
    )
  }

Or if the values of the column can repeat, you can use a conditional:

  /**
   * Get the rows with the service
   */
  getRows(): void {
    this._rowsService.getRows().subscribe(
      ( response ) => { 
            this.rows = response;
            response.data.forEach( row => {
              if( !this.settings.columns.myColumn.filter.config.list.includes(row.myColumn) ){
                  this.settings.columns.myColumn.filter.config.list.push({value: row.myColumn , title: row.myColumn});
                  this.settings = Object.assign({}, this.settings);  
              }            
            });        
      }
    )
  }

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant