search by specific column

[Ananya Juhi]

Hello,

I need a search functionality for each specific column present in my grid. Like, there should be a way to search by a specific column of the grid. I should have a column chooser from where I should be able to choose a column and search data from that particular column. 

Is it possible to have ? Is there any way to achieve it ?

Could you please give any solutions for it ?

Thanks.

[Dhivya Rajendran]

Hi Ananya, 

Thanks for contacting Syncfusion support, 

Query: search by specific column? 

 

Yes, it possible to search specific column by using searchSettings.fields Property of Grid. We have analyzed your requirement and we have created a sample for your reference. In the below sample we have get the visible columns by using getVisibleColumns() method and assign the visible columns.field to searchSettings.fields, so that searching is performed only for the visible columns. The above action is performed, when you choose(change the visible propery) the columns by using columnChooser. Kindly please refer the below code snippet and sample for more information. 

@Component({ 

    selector: 'app-container', 

    template: `<ejs-grid #grid [dataSource]='data' [height]='260' [searchSettings]='searchSettings' (actionComplete)='actionCompleteHandler($event)' [showColumnChooser]= 'true' [toolbar]='toolbar'> 

                        <e-column field='Freight' headerText='Freight' textAlign='Center' format='C2' width=80></e-column> 

                        <e-column field='ShipCountry' headerText='Ship Country' [visible]='false' width='150'></e-column> 

       . . . . . . 

}) 

export class AppComponent implements OnInit { 

       . . . . . . . 

    actionCompleteHandler(args){ 

        if (args.requestType ==='columnstate'){ 

             this.grid.searchSettings.fields = this.grid.getVisibleColumns().map(columns => return columns.field); 

             . . . . . . 

        } 

Sample : https://plnkr.co/edit/MXM8mEGY9ifub6Lr98RW?p=preview  

Documentation: https://ej2.syncfusion.com/16.1.24/angular/documentation/grid/searching.html#search-specific-columns   

 

Regards, 

R.Dhivya