Hi ,
We are using advance filtering as mentioned here https://ko.infragistics.com/products/ignite-ui-angular/angular/components/grid/advanced-filtering
looking for few customization
1. Drop down field in the column is currently default bound to columns source of grid , can we customize that to other source instead of default columns
2. In the value field currently it is a free text box can we have a searchable drop down for that field
Hello,
Thank you for your follow-up message!
I have been looking into your additional question and an approach I could suggest is using the Excel Style Filtering functionality as it provides the IgxExcelStyleSearchComponent which is populated with all the unique values in the corresponding column and provides a search input field that allows filtering these values.
Furthermore, in case you do not require all features in the Excel Style Filtering menu like sorting, moving, pinning, etc., the feature allows templating the filtering dialog to include only some of the functionalities. More information could be found in our Templates subtopic here.
Additionally, I believe that you will find our Remote Data Operations topic here quite helpful as it provides detailed information along with code snippets and samples demonstrating how remote operations such as sorting, filtering, paging, etc., could be achieved.
Please let me know if you need any further assistance regarding this matter.
Looking forward to your reply.
Sincerely, Riva Ivanova Entry Level Software Developer
ok i understand in advanced filtering it is not customizable.
what other feature we can use with remote pagination that for filtering or doing any querying that user can see what is in the grid for filtering and not just type some value .
we have used infragistics WPF and there we had an inbuilt option that value dropdown by default loaded all the unique values in the column. can you redirect some thing similar here for angular or any samples on how we can use igxquery builder for us to build something
Thank you for following up!
After further investigating this matter, what I could say is that from your initial message I was under the impression that you require filtering the IgxGrid by additional fields that are not defined as IgxGrid columns.
For example, as shown in the attachment below, the displayed columns in the IgxGrid are Product Name, Quantity Per Unit, Unit Price and Discontinued, however, in the advanced filtering dialog in the Select column dropdown, the Order Date field is also displayed, and the records could be filtered by Order Date as well.
This behavior could be achieved by using the IgxQueryBuilder component, however, a better approach would be defining the columns in the IgxGrid component and setting the hidden property to true. This way the columns will not be shown in the IgxGrid, but advanced filtering could be performed by them.
However, regarding changing the default Value input, as previously mentioned, this behavior is by design and is not customizable when using the Advanced Filtering feature or the Query Builder component as they use the default built-in editors for the corresponding data type.
Sincerely,Riva IvanovaEntry Level Software Developer
Hi Riva, thanks for the quick update.what i understand is both the column and value fields are not customizable. using Advanced Filtering Interaction can we get the simila UI and just customize the value fields from the remote data source.
we are using server side pagination and in the value field we are trying to populate all the unique values in the grid so user can either select or type in for filtering.
looking to use existing one as again builder query builder will have its own effort. for column fields i think we can use
https://ko.infragistics.com/products/ignite-ui-angular/angular/components/grid/advanced-filtering#interaction
is it possible for value fields can retain unique value from that column which is selected for each column
Thank you for posting into our community!
I have been looking int your question and what I could say is that the advanced filtering functionality by design uses the corresponding IgxGrid component as a source for its columns and this is the default behavior which is not customizable.
Furthermore, the value field internal editor depends on the data type of the selected column, e.g., in case of column with data type “string”, the default editor will be an editable input field, whereas for a column with data type “date” the editor will be an IgxDatePicker component. This behavior is also by design and is not customizable. More information regarding the default editing templates for all data types could be found in our Editing topic here.
Additionally, as mentioned in our Advanced Filtering Interaction section here, the dialog is using the IgxQueryBuilder component to generate, display and edit the filtering logic and what I would suggest is referring to our Query Builder topic here as the component provides a feature rich UI that allows building complex data filtering queries for a specified data set.
Having this in mind, a possible approach I could suggest is implementing a custom filtering functionality by adding a custom button to the IgxToolbar component that opens a dialog where the query builder component is hosted. More information regarding adding custom content to the IgxToolbar could be found here.