1. Home
  2. Forum
  3. Angular - EJ 2
  4. FilterBar cursor of left side after "Immediate" Filter

FilterBar cursor of left side after "Immediate" Filter

Hi Team !

We change filter mode "Enter" to "Immediate" like the object below:



But after we enter a word into the filterBar input and the filter is executed, the cursor go to the left side (see the gif).
The only action we do is to change in "actionBegin" event the operator "starwith" by "contains" but even without it, we got the same thing

- Is it the standard operation that cursor go to the left side after a filter ?
- How is it possible to keep the cursor to the right side to continu ?

Regards



Attachment: gif_b1567902.7z

6 Replies
MS Manivel Sellamuthu Syncfusion Team April 1, 2020 11:16 AM UTC

Hi Mohamed, 

Greetings from Syncfusion support. 

By default once you performed filtering the filter bar cursor will not be move without user interaction. We have prepared a sample based on your code example but the reported scenario is not reproduced at our end.  

Please find the below sample for your reference. 


To validate further on the issue, please share the details, which will be helpful for us to validate the issue. 

1. Syncfusion packages version. 

2. Share the complete Grid code. 

3. If the scenario can be replicated in our sample, please share the steps 

Regards, 
Manivel 


MB Mohamed BENNOUR April 1, 2020 12:32 PM UTC

Hi Manivel !

Thanks for your reply. We know that it is not the normal behavio because all exemples from the net are good but every exemple is a little implementation of grid functionnalities and we know that sometimes an assembly of several functionnalites can have a side effect like the persistence or the frozen column.
 Here is what we use in our grid:
1 - Version of packages used with Angular 8


2- Here is grid code
<ejs-grid
    #syncgrid
    width='100%'
    height='100%'

    [dataSource]='rowData'
    [columns]="columnDefs"
    (dataBound)='dataBound($event)'

    [locale]="'fr-FR'"

    [allowSorting]="allowSorting"
    [allowMultiSorting]="allowMultiSorting"
    [sortSettings]='sortOptions'

    [allowFiltering]="allowFiltering"
    [filterSettings]='filterOptions'

    [allowGrouping]="allowGrouping"
    [groupSettings]="groupOptions"

    [allowResizing]="allowResizing"
    [allowReordering]="allowReordering"

    [allowPaging]="allowPaging"
    [pageSettings]='pageSettings'

    [allowSelection]="allowSelection"
    [selectionSettings]="selectionOptions"
    [selectedRowIndex]="selectedRowIndex"
    (rowSelected)="rowSelected($event)"
    (rowSelecting)="rowSelecting($event)"
    (rowDeselected)="rowDeselected($event)"
    (rowDeselecting)="rowDeselecting($event)"

    [allowTextWrap]='false'

    [showColumnMenu]='true'

    [contextMenuItems]="contextMenuItems"
    (columnMenuClick)="columnMenuClick($event)"
    (contextMenuClick)="contextMenuClick($event)"

    (contextMenuOpen)="contextMenuOpen($event)"

    [allowExcelExport]='true'
    [allowPdfExport]='true'

    [searchSettings]='searchOptions'

    (headerCellInfo)='headerCellInfo($event)'
    (created)= "onCreated($event)"
    (resizing)="atResizing($event)"
    (mouseover)="onMouseOver($event)"
    (mouseout)="onMouseOut($event)"
    (actionBegin)=atActionBegin($event)
    (actionFailure)="onActionFailure($event)">
We have detail template, classique columns, custom columns with template and group caption template.

As you saw in our previous message, nothing special is done. We filter a column with an immediate option.

Regards,



MS Manivel Sellamuthu Syncfusion Team April 2, 2020 08:30 AM UTC

Hi Mohamed, 

Thanks for your update. 

Based on your update we have changed packages in the given sample to 17.4.47 and tried with the shared code example. But in our sample we did not face the mentioned issue. 

In your code example you have binded some events and property binding, but we did not have code example event function and property binding so we did not use the events in our sample. 
 
So, we suggest you to replicate the issue in the given sample or share the issue reproduceable sample  which would help us to proceed further. 

Please get back to us, if you need further assistance. 

Regards, 
Manivel 


MB Mohamed BENNOUR April 3, 2020 10:00 AM UTC

Hi Manivel,

We lost productive time to find that's not our code but a real bug that is easy to reproduce. We opened a feedback ticket for that.
To reproduce it, you only have to combine filter option with selection options like below:

Here is the component:
import { Component, OnInit, ViewChild, Inject } from '@angular/core';
import { categoryData } from './data';
import { ChangeEventArgs } from '@syncfusion/ej2-dropdowns';
import { FilterService, GridComponent } from '@syncfusion/ej2-angular-grids';

import { FilterSettingsModel, SelectionSettingsModel } from '@syncfusion/ej2-angular-grids';

@Component({
    selector: 'app-root',
    templateUrl: 'app.component.html',
    styleUrls: ['app.component.css'],
    providers: [FilterService]
})
export class AppComponent {
    public data: Object[];
    public ddldata: Object[];
    public pageOptions: Object;
    public category: string[];

    public selectionOptions: SelectionSettingsModel;
    public filterOptions: FilterSettingsModel;

    @ViewChild('grid')
    public grid: GridComponent;
    
    constructor( ) {  
    }
    
    public ngOnInit(): void {
      this.filterOptions= {
        ignoreAccent: true,
        showFilterBarStatus: false,
        mode: 'Immediate',
        immediateModeDelay: 1000,
        type: 'FilterBar'
      };

      this.selectionOptions = {
        checkboxMode: 'ResetOnRowClick'
        };
        this.data = categoryData;
    }
}

Here is the template:
<div class="control-section">
    <ejs-grid #grid [dataSource]='data' allowPaging='true' allowFiltering='true' [pageSettings]="pageOptions"
    [filterSettings]='filterOptions'
    [selectionSettings]='selectionOptions'>
        <e-columns>
          <e-column type='checkbox' width='50'></e-column>
            <e-column field='CategoryName' headerText='Category Name' width='170'></e-column>
            <e-column field='ProductName' headerText='Product Name' width='150'></e-column>
            <e-column field='QuantityPerUnit' headerText='Quantity per unit' width='180' textAlign='Right'></e-column>
            <e-column field='UnitsInStock' headerText='Units In Stock' width='150' textAlign='Right'></e-column>
        </e-columns>
    </ejs-grid>
</div>




Attachment: Filterbugsample_and_gif_5ea224e3.7z

MS Manivel Sellamuthu Syncfusion Team April 6, 2020 08:57 AM UTC

Hi Mohamed, 

Thanks for your update. 

We appreciate your efforts on reproducing the bug. We have confirmed that the behavior is an issue from our side and logged a bug for same as “Filterbar focusing is not working properly, while using checkboxmode as 'resetonrowclick'”. At Syncfusion, we are committed to fixing all validated defects (subject to technological feasibility and Product Development Life Cycle ) and including the defect fix in our upcoming Patch Release Apr 22nd 2020. 

You can now track the current status of your request, review the proposed resolution timeline, and contact us for any further inquiries through this link.  
 

Regards, 
Manivel 


MS Manivel Sellamuthu Syncfusion Team May 14, 2020 08:44 AM UTC

Hi Mohamed, 
  
We are glad to announce that our Essential Studio 2020 Volume 1 Service Pack1 release v18.1.52  is rolled out and is available for download under the following link. 
  
  
We have fixed the reported issue “Filterbar focusing is not working properly, while using checkboxmode as 'resetonrowclick'” in our 18.1.45 release. So kindly upgrade to our latest version (18.1.52) or minimum of 18.1.45 version to resolve the reported issue. Please find the release notes regarding the same from below  
 
 
We thank you for your support and appreciate your patience in waiting for this release. Please get in touch with us if you would require any further assistance. 
  
Regards, 
Manivel 


Loader.
Up arrow icon