We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. (Last updated on: June 24, 2019).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

No focus on row after Delete

Thread ID:

Created:

Updated:

Platform:

Replies:

144097 Apr 18,2019 08:50 AM UTC Apr 19,2019 12:15 PM UTC Angular - EJ 2 1
loading
Tags: Grid
Christoph Manig
Asked On April 18, 2019 08:50 AM UTC

Hello,

I have implemented a table with multiple row selection per checkbox. When I select some rows and click on the delete button, the row of the last selected index is selected after the deletion. I want that no row is selected after I delete one or more rows. How can I solve this problem?

<ejs-grid
    #grid
    width="100%"
    height="700"
    [dataSource]="tableData"
    [selectionSettings]='selectionOptions'
    [editSettings]='editSettings'
    [toolbar]='toolbar'
  >
    <e-columns>
      <e-column type='checkbox' width='50'></e-column>
      <e-column field="nationalitaetSv" headerText='Nationalitätenkennzeichen' [validationRules]="svRules"></e-column>
      <e-column field="nationalitaetIso" headerText="ISO-Kennzeichen" [validationRules]="isoRules"></e-column>
      <e-column field="nationalitaetTextKurz" headerText="Kurzbezeichnung" [validationRules]="kurzRules"></e-column>
      <e-column field="nationalitaetTextLang" headerText="Langbezeichnung" [validationRules]="langRules"></e-column>
      <e-column field="malus" headerText="Malus" [validationRules]="malusRules"></e-column>
      <e-column field="prio" headerText="Priorität"></e-column>
      <e-column field="schnellzugriff" headerText="Schnellzugriff" [displayAsCheckBox]="true"></e-column>
      <e-column field="tastaturKuerzel" headerText="Tastaturkürzel"></e-column>
    </e-columns>
  </ejs-grid>

ngOnInit() {
    this.tableData=data;
    this.selectionOptions = { checkboxMode: 'ResetOnRowClick'};
    this.editSettings = { allowEditing: true, allowAdding: true, allowDeleting: true };
    this.toolbar = ['Add', 'Edit', 'Delete'];
    this.svRules = { required: true};
    this.isoRules = { required: true, minLength: 2, maxLength: 2};
    this.kurzRules = { required: true};
    this.langRules = { required: true};
    this.malusRules = { required: true, number: true};
  }



Kuralarasan Muthusamy [Syncfusion]
Replied On April 19, 2019 12:15 PM UTC

Hi Christoph, 

Thanks for contacting Syncfusion support. 

From your query we found that you want to clear the selection from the Grid after complete the delete action. You can prevent this row selection by simply provide args.cancel as true in rowSelecting event of the Grid based on some conditions. Please refer the following code snippet, 

HTML: 
 
<ejs-grid #normalgrid id='Normalgrid' [dataSource]='data' allowPaging='true' (actionComplete)='actionComplete($event)' (rowSelecting)='rowSelecting($event)' [pageSettings]='pageSettings' [editSettings]='editSettings' [toolbar]='toolbar'> 
    <e-columns> 
        <e-column type="checkbox" width='140'></e-column> 
    </e-columns> 
</ejs-grid> 

TypeScript: 

export class AppComponent { 
        public flag: boolean = false; 
 
        actionComplete(args) { 
            if (args.requestType == "delete") { 
                this.flag = true; 
            } 
        } 
        rowSelecting(args) { 
            if (this.flag) { 
                this.flag = false; 
                args.cancel = true; 
            } 
        } 
    } 

We have prepared the sample with this requirement for your reference and you can find that sample from the below link, 


Regards, 
Kuralarasan M 


CONFIRMATION

This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

Please sign in to access our forum

This page will automatically be redirected to the sign-in page in 10 seconds.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon

Live Chat Icon For mobile
Live Chat Icon