CODEWITHSUNDEEP
angularng2-smart-table
Gelso77
Gelso77

Reputation: 1895

ng2-smart-table open popup on edit click

I would like to open a popup page on the ng2-smart-table component when the user click on edit and new button, but I can't catch these events.
For instance I can't catch the onEditRowSelect($event) function, do you have any idea?
To make it short , I would like to remove the edit input field inside the table and open a popup page

<ng2-smart-table 
  [settings]="settings" 
  [source]="data"                
  (editConfirm)="onEditRowSelect($event)">
</ng2-smart-table>

Here is my ng2-smart-table settings 

this.settings = {

  columns: {
  },
  actions: {
    position: 'right',
    add: true,
    edit:true,
    editable:false,
    columnTitle: '',
  },
  add: {
    addButtonContent: 'NEW',                        
  },
  edit: {
    editButtonContent: 'EDIT',                        
    position: 'right',
  }      
}    

onEditRowSelect(event) {
  console.log(event.data.nombre);             
}

Upvotes: 3

Views: 5298

Answers (2)

shamim khan
shamim khan

Reputation: 477

First, you need to change the "mode option in setting in the ts file

settings = {mode: 'external'}

Now add html to this code

<ng2-smart-table [settings]="settings" [source]="data" (edit)="onEditRowSelect($event)"></ng2-smart-table>

Now in ts file create that function onEditRowSelect(event) you'll find all the content there

onEditRowSelect(event) { console.log(event); }

If you want to open a modal then create a component first and then pass data into that modal. If you don't know how to create a modal then follow this link material dialog

Upvotes: 6

Sachin Shah
Sachin Shah

Reputation: 4533

I have a same issue. And I solved by add this code in this.settings. 

edit: {
   confirmSave : true
}

Upvotes: 2

Related Questions