ornamentum
ornamentum copied to clipboard
yohangz
Filter issue - along with filtered values, null or empty values are also displayed on filtered issues
Hi,
I had found a issue while filtering using filters of data grid. In my data, empty values are present. So when I select valid options excluding empty option, results of filtered data also has listed empty values in that column.
I don't want to display empty values, when I filter some valid column options.
Is there a solution for it? Please help.
@arunmeanssun, could you please share the example source with some sample data?
`<ng-data-table
[id]="'assign_duty_slot'"
[title]="'Volunteers Shift Timing'"
[items]="volunteer_shift_list"
[minContentHeight]="270"
[minContentWidth]="900"
[showHeader]="false"
[pageable]="true"
[showRefreshButton]="true"
[showRowSelectCheckbox]="false"
[rowSelectable]="false"
[selectOnRowClick]="false"
[showSubstituteRows]="false"
[persistTableState]="true"
[showColumnSelector]="true"
[expandableRows]="false"
[showLoadingSpinner]="true"
[selectMode]="'multi'"
[showRowSelectAllCheckbox]="false">
<ng-data-table-column
[field]="'volunteer_name'"
[title]="'Volunteer Name'"
[sortable]="true"
[filterable]="true"
[showDropdownFilter]="true"
[dropdownFilterShowClearSelectionButton]="true"
[dropdownFilterSearchable]="true"
[dropDownFilterShowOptionSelectCheckbox]="true"
[filterPlaceholder]="'Search'"
[width]="130"
[resizable]="true">
</ng-data-table-column>
<ng-data-table-column
[field]="'volunteer_id'"
[title]="'Volunteer Id'"
[sortable]="true"
[filterable]="true"
[showDropdownFilter]="true"
[dropdownFilterShowClearSelectionButton]="true"
[dropdownFilterSearchable]="true"
[dropDownFilterShowOptionSelectCheckbox]="true"
[filterPlaceholder]="'Search'"
[width]="80"
[resizable]="true">
</ng-data-table-column>
<ng-data-table-column
[field]="'month'"
[title]="'For Month'"
[sortable]="true"
[filterable]="true"
[showDropdownFilter]="true"
[dropdownFilterShowClearSelectionButton]="true"
[dropdownFilterSearchable]="true"
[dropDownFilterShowOptionSelectCheckbox]="true"
[filterPlaceholder]="'Search'"
[width]="50"
[resizable]="true">
</ng-data-table-column>
<ng-data-table-column
[field]="'week_day'"
[title]="'On Week Day'"
[sortable]="true"
[filterable]="true"
[showDropdownFilter]="true"
[dropdownFilterShowClearSelectionButton]="true"
[dropdownFilterSearchable]="true"
[dropDownFilterShowOptionSelectCheckbox]="true"
[filterPlaceholder]="'Search'"
[width]="150"
[resizable]="true">
</ng-data-table-column>
<ng-data-table-column
[field]="'time_string'"
[title]="'Assigned Slot'"
[sortable]="true"
[filterable]="true"
[showDropdownFilter]="true"
[dropdownFilterShowClearSelectionButton]="true"
[dropdownFilterSearchable]="true"
[dropDownFilterShowOptionSelectCheckbox]="true"
[filterPlaceholder]="'Search'"
[width]="85"
[resizable]="true">
</ng-data-table-column>
<ng-data-table-column
[field]="'shift_type'"
[title]="'Shift Type'"
[sortable]="true"
[filterable]="true"
[showDropdownFilter]="true"
[dropdownFilterShowClearSelectionButton]="true"
[dropdownFilterSearchable]="true"
[dropDownFilterShowOptionSelectCheckbox]="true"
[filterPlaceholder]="'Search'"
[width]="50"
[resizable]="true">
</ng-data-table-column>
<ng-data-table-column [field]=""
[title]="'Action'"
[width]="50"
[resizable]="true">
<ng-template #ngDataTableCell let-row="row">
<td class="color-brown-bright text-center">
<i class="fas fa-user-clock mr-2 f_size_16" (click)="assign_slot_modal($event, row)"></i>
</td>
</ng-template>
</ng-data-table-column>
<ng-template #ngDataTableLoadingSpinner>
<p class="text-center w-100"> <img src="../../../assets/images/spinning-circles.svg" width="50" height="50" alt="loader spinner"> <br> Data Loading, Please wait...</p>
</ng-template>
<ng-template #ngDataTableNoRecords>
<p class="text-center"> <i class="fas fa-phone-slash f_size_50 mb-3 color-brown-bright"></i>
<br> No HR Call Logs data have been found.</p>
</ng-template>
<ng-template #ngDropdownLoadingSpinner>
<img src="../../../assets/images/spinning-circles.svg" width="25" alt="loader spinner">
</ng-template>
</ng-data-table>`
[{"role":"director","volunteer_name":"Chandra Mouli","volunteer_id":"39","shift_type":"general","week_day":"sunday","time_string":"10:00 AM to 2:00 PM","end_time":"14:00","_id":"5e621dec95952e23c4b05e8b","start_time":"10:00"},{"role":"director","volunteer_name":"Chandra Mouli","volunteer_id":"39","shift_type":"rota","date":"2020-03-13","month":"march","week_day":"saturday","time_string":"10:30 AM to 2:30 PM","end_time":"14:30","_id":"5e621ed895952e23c4b05eb9","start_time":"10:30"},{"role":"co-ordinator","volunteer_name":"Daniel Androws","volunteer_id":"67","shift_type":"general","week_day":"monday","time_string":"8:00 AM to 12:00 PM","end_time":"12:00","_id":"5e621dfa95952e23c4b05e92","start_time":"08:00"},{"role":"co-ordinator","volunteer_name":"Daniel Androws","volunteer_id":"67","shift_type":"rota","date":"2020-03-14","month":"march","week_day":"saturday","time_string":"1:30 PM to 5:30 PM","end_time":"17:30","_id":"5e624f6595952e23c4b06003","start_time":"13:30"},{"role":"co-ordinator","volunteer_name":"Daniel Androws","volunteer_id":"67","shift_type":"rota","date":"2020-04-25","month":"april","week_day":"saturday","time_string":"6:30 AM to 10:30 AM","end_time":"10:30","_id":"5e8ed1f369801b39b04802bf","start_time":"06:30"},{"role":"co-ordinator","volunteer_name":"Daniel Androws","volunteer_id":"67","shift_type":"rota","date":"2020-05-09","month":"may","week_day":"saturday","time_string":"1:30 PM to 5:30 PM","end_time":"17:30","_id":"5e8ed21169801b39b04802de","start_time":"13:30"},{"role":"director","volunteer_name":"Director Kumar","volunteer_id":"68","shift_type":"general","date":null,"month":null,"week_day":"sunday","time_string":"2:00 PM to 6:00 PM","end_time":"18:00","_id":"5e621e0b95952e23c4b05e99","start_time":"14:00"},{"role":"director","volunteer_name":"Director Kumar","volunteer_id":"68","shift_type":"rota","date":"2020-03-14","month":"march","week_day":"sunday","time_string":"3:30 PM to 7:30 PM","end_time":"19:30","_id":"5e624f9d95952e23c4b0600a","start_time":"15:30"},{"role":"director","volunteer_name":"Ravi Sommisetty","volunteer_id":"70","shift_type":"general","week_day":"tuesday","time_string":"8:00 AM to 12:00 PM","end_time":"12:00","_id":"5e621e1b95952e23c4b05ea0","start_time":"08:00"},{"role":"director","volunteer_name":"Ravi Sommisetty","volunteer_id":"70","shift_type":"rota","date":"2020-03-21","month":"march","week_day":"saturday","time_string":"1:30 PM to 5:30 PM","end_time":"17:30","_id":"5e6250ff95952e23c4b0602c","start_time":"13:30"},{"role":"volunteer","volunteer_name":"Mukesh","volunteer_id":"73","shift_type":"general","week_day":"tuesday","time_string":"12:00 PM to 4:00 PM","end_time":"16:00","_id":"5e96dfff2e0ffb0a488aa26a","start_time":"12:00"},{"role":"director","volunteer_name":"Monisha R","volunteer_id":"76"},{"role":"admin","volunteer_name":"Chandrasekar","volunteer_id":"78","shift_type":"general","week_day":"wednesday","time_string":"4:00 PM to 8:00 PM","end_time":"20:00","_id":"5e96e03b2e0ffb0a488aa2d2","start_time":"16:00"},{"role":"volunteer","volunteer_name":"Kumara Varman","volunteer_id":"79"},{"role":"volunteer","volunteer_name":"test user 1","volunteer_id":"80","shift_type":"general","week_day":"monday","time_string":"8:00 AM to 12:00 PM","end_time":"12:00","_id":"5e92f85c427d534b44005fa4","start_time":"08:00"},{"role":"volunteer","volunteer_name":"test user 1","volunteer_id":"80","shift_type":"rota","date":"2020-04-12","month":"april","week_day":"sunday","time_string":"4:30 PM to 8:30 PM","end_time":"20:30","_id":"5e92f87f427d534b44005fcd","start_time":"16:30"},{"role":"volunteer","volunteer_name":"tester501","volunteer_id":"81"},{"role":"volunteer","volunteer_name":"tester502","volunteer_id":"82","shift_type":"rota","date":"2020-04-12","month":"april","week_day":"sunday","time_string":"4:30 PM to 8:30 PM","end_time":"20:30","_id":"5e92f7d2427d534b44005ee1","start_time":"16:30"},{"role":"co-ordinator","volunteer_name":"tester 503","volunteer_id":"83"},{"role":"admin, volunteer","volunteer_name":"tester 504","volunteer_id":"84"},{"role":"volunteer","volunteer_name":"tester505","volunteer_id":"85"},{"role":"admin","volunteer_name":"tester506","volunteer_id":"86"},{"role":"volunteer","volunteer_name":"tester507","volunteer_id":"87"},{"role":"admin","volunteer_name":"tester508","volunteer_id":"88"},{"role":"volunteer","volunteer_name":"tester509","volunteer_id":"89"},{"role":"volunteer","volunteer_name":"tester510","volunteer_id":"90"},{"role":"volunteer","volunteer_name":"tester511","volunteer_id":"91"},{"role":"admin, volunteer","volunteer_name":"tester512","volunteer_id":"92"},{"role":"volunteer","volunteer_name":"tester513","volunteer_id":"93"},{"role":"volunteer","volunteer_name":"tester514","volunteer_id":"94","shift_type":"general","week_day":"thursday","time_string":"2:00 PM to 6:00 PM","end_time":"18:00","_id":"5e96e11f2e0ffb0a488aa310","start_time":"14:00"},{"role":"volunteer","volunteer_name":"tester515","volunteer_id":"95"},{"role":"admin","volunteer_name":"tester516","volunteer_id":"96"},{"role":"admin","volunteer_name":"tester517","volunteer_id":"97"},{"role":"volunteer","volunteer_name":"Alog ","volunteer_id":"98"}]
the data and code above is being used. when i do a filter operation on "assigned slot" column, i face this issue. that is, if you select any one column in dropdown filter, empty data fields are also included in the result.
We are looking at using this component, the filtering does include blank values when it shouldn't. Is this something that can be easily fixed or worked around?
