I am attempting to trigger a dataUpdate function upon clicking the edit() button
I am striving to modify the record
Current Version:
- Angular CLI: 10.0.6
- Angular: 10.0.10
https://i.sstatic.net/4MR8P.png
registration.component.html
<div>
<button type="button" (click)="registration()">Submit</button>
<div style="margin:5px;"></div>
<button type="button" (click)="edit()">Edit</button>
</div>
<h2>List Of Employee</h2>
<ag-grid-angular style="width: 1150px; height: 200px;"
class="ag-theme-balham"
[rowData]="elist"
[columnDefs]="columnDefs"
(rowClicked)='onGridRowClicked($event)'>
</ag-grid-angular>
registration.component.ts
columnDefs = [
{ headerName: 'empid', field: 'empid' },
{ headerName: 'username', field: 'username' },
{ headerName: 'empaddress', field: 'empaddress' },
{ headerName: 'password', field: 'password' },
{ headerName: 'country', field: 'country' },
{
headerName: 'Edit',
template: '<span><i class="fa fa-edit" data-action-type="edit"></i></span>',
}
];
onGridRowClicked(e: any) {
if (e.event.target !== undefined) {
let actionType = e.event.target.getAttribute("data-action-type");
if (actionType == "edit") {
this.rowData = this.myservice.getExistRecord(e.data.empid).subscribe((data: any) => {
debugger
console.log("inside get data from list 1")
if (data.message == "GetSuccess") {
//get data from the list
debugger
this.txtusername = e.data.username;
this.txtempaddress = e.data.empaddress;
this.txtpassword = e.data.password;
this.txtcountry = e.data.country;
//after retrieving the data then update a record
var dataUpdate = function () {
this.myservice.editExistRecord(e.data.empid, this.txtusername, this.txtempaddress, this.txtpassword, this.txtcountry).subscribe((data: any) => {
console.log("Inside editExistRecord")
if (data.message == "UpdateSuccessfully") {
this.list();
}
});
}
console.log("empid", e.data.empid);
console.log("Edit Icon Clicked");
}
});
}
else if (actionType == "delete") {
console.log("View delete action clicked");
}
}
}
edit() {
console.log("inside edit button click event");
//dataUpdate();//here I am trying to call dataupdate function
}
e.data.empid //here, I am retrieving the empid which is why I am creating a function
how do I invoke this function?
var dataUpdate = function () {
When the user presses the edit() button, how can I call the dataUpdate function?
I have obtained the data from the list, but now I want to update it
If I write this code outside, empid becomes undefined