ng2-smart-table - New row data is empty after add row

0
votes

For ng2-smart-table after adding a row then the data that shows in the table was empty but I can edit the empty row and save and can also delete.

data that show in event.newData is empty

(createConfirm)="onCreateConfirm($event) --> is not working

(editConfirm)="onSaveConfirm($event) --> is ok

(deleteConfirm)="onDeleteConfirm($event) --> is ok

empty row in table

Hope someone can help Thank you in advance

  1. .html

    <ng2-smart-table
     [settings]="settings" 
     [source]="source"
     (deleteConfirm)="onDeleteConfirm($event)" 
     (editConfirm)="onSaveConfirm($event)"
     (createConfirm)="onCreateConfirm($event)">
    </ng2-smart-table>
  1. .ts

        data = [];

        settings = {
        add: {
        addButtonContent: '<i class="nb-plus"></i>',
        createButtonContent: '<i class="nb-checkmark"></i>',
        cancelButtonContent: '<i class="nb-close"></i>',
        confirmCreate: true,
        },
        edit: {
          confirmSave: true,
          editButtonContent: '<i class="nb-edit"></i>',
          saveButtonContent: '<i class="nb-checkmark"></i>',
          cancelButtonContent: '<i class="nb-close"></i>',

        },
        delete: {
          confirmDelete: true,
          deleteButtonContent: '<i class="nb-trash"></i>',

        },
        columns: {
          jobProcessId: {
            title: 'ID',
            type: 'number',
            width: '100px',
          },
          processName: {
            title: 'Job Process Name',
            type: 'string',

          },
          processDescription: {
            title: 'Job Process Description',
            type: 'string',
            width: 'auto',

          },
        },
      };

      source: LocalDataSource = new LocalDataSource();
      constructor(private jobProcess: JobProcessService) {

        this.jobProcess.list().subscribe((res: any[]) => {
          this.data = res;
          console.log(this.data);
          this.source.load(this.data);
        } );

      }

      ngOnInit() {
      }

      onCreateConfirm(event) {
        console.log(event.newData);
        if (window.confirm('Are you sure you want to create?')) {
          event.confirm.resolve();
        } else {
          event.confirm.reject();
        }
      }
      onDeleteConfirm(event) {
        if (window.confirm('Are you sure you want to delete?')) {
          event.confirm.resolve();
        } else {
          event.confirm.reject();
        }

      }

        onSaveConfirm(event) {
        if (window.confirm('Are you sure you want to save?')) {
            event.confirm.resolve();
          } else {
            event.confirm.reject();
          }
      }
1
angularng2-smart-tablenebular

1 Answers

0
votes

use this to your html

 <ng2-smart-table [settings]="settings" [source]="source" 
(createConfirm)="onCreateConfirm($event)"

(deleteConfirm)="onDeleteConfirm($event)"
(editConfirm)="onSaveConfirm($event)">

 </ng2-smart-table>

*components*

settings = {delete: {
  confirmDelete: true
},
add: {
  confirmCreate: true
},
edit: {
  confirmSave: true
},
 .......
}
source: LocalDataSource;
 constructor() {
this.source = new LocalDataSource(this.data);
}
 onDeleteConfirm(event):void {
 if (window.confirm('Are you sure you want to delete?')) {



  event.confirm.resolve(); 
  } else {
event.confirm.reject();
 }

}

onSaveConfirm(event):void {
  if (window.confirm('Are you sure you want to save?')) {
 event.newData['name'] += ' + added in code'; 
 event.confirm.resolve(event.newData);
 } else {
 event.confirm.reject();
}
  onCreateConfirm(event):void { 
  event.confirm.resolve(event.newData);
  }