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. Image for the cookie policy date

Delete Row

I have a grid with the first column containing actions that can be performde on the line, one of them is the deletion, but when i call the deleteRecords or deleteRow methods nothing happens, how can i make this?

[HTML]

<ejs-grid id= "segnalationGrid" [dataSource]='dataGrid | async' (created)="created()" [allowSorting]='true'>
   <e-columns>
      <e-column headerText='Azioni' width=180>
         <ng-template #template let-data>
            <div class='e-btn-group'cssClass='e-flat'>
               <button ejs-button class="takeButton" cssClass='e-flat'><span class="e-icons e-info2"></span></button>
               <button ejs-button class="checkButton" cssClass='e-flat'><span class="e-icons e-check"></span></button>
               <button ejs-button class="noteButton" cssClass='e-flat'><span class="e-icons e-addnote"></span></button>
               <button ejs-button class="closeButton" cssClass='e-flat'><span class="e-icons e-close" (click)="deleteRow()"></span></button>
            </div>
         </ng-template>
      </e-column>
      <e-column field='idContainer' [visible]="false" [isPrimaryKey]="true"></e-column>
      <e-column field='containerName' headerText='Nome' width=120></e-column>
      <e-column field='eventDate' headerText='Data' textAlign='Right' format='yMd' width=120></e-column>
      <e-column field='idLanguage' headerText='T' textAlign='Right' width=90></e-column>
      <e-column field="description" headerText='Descrizione'></e-column>
   </e-columns>
</ejs-grid>


[TS]

import { Component, OnInit, ViewChild } from '@angular/core';
import { ActiveWarnings } from '../shared/models/activewarnings';
import { ActiveWarningsStore } from '../shared/stores/activewarnings.store';
import { Observable } from 'rxjs';

@Component({
  selector: 'app-segnalation-grid',
  templateUrl: './segnalation-grid.component.html',
  styleUrls: ['./segnalation-grid.component.scss']
})
export class SegnalationGridComponent implements OnInit {
   public dataGrid: Observable<ActiveWarnings[]>;
   @ViewChild('segnalationGrid') public grid: any;


  constructor(public activeWarningsStore:ActiveWarningsStore) { }

   ngOnInit() {
      this.dataGrid = this.activeWarningsStore.activeWarnings;
  }

   created() {
      var grid = document.getElementById("segnalationGrid");
      grid.parentElement.style.height = window.innerHeight + "px";
   } 
   deleteRow() {
      this.grid.deleteRow();
   }

}


1 Reply

SS Seeni Sakthi Kumar Seeni Raj Syncfusion Team September 26, 2019 02:38 AM

Hi Emanuele, 

Greetings from Syncfusion.  

We could see you would like to delete the rows using the external actions with the use of deleteRows or deleteRecord methods. Usually, this actions requires the EditService to be injected and enable the editSettings.allowDeleting. Refer to the following Help Document. 


Also, refer to the Observables concept of the Grid in the following Help Document. 


Regards,  
Seeni Sakthi Kumar S 


Loader.
Live Chat Icon For mobile
Up arrow icon