Hey Raju,
You can define your own Angular components to render and edit cells via
cellEditor and cellRenderer properties (cf the doc)
<https://www.ag-grid.com/javascript-grid-cell-editor/#angular-cell-editing>.
For the edition your component has to implement ICellEditorAngularComp
with this methods for the initialization:
agInit(params: ICellEditorParams): void {
this.params = params;
this.logger.debug('params', params);
}
When you stop the edition you can notify it to agGrid with
this.params.stopEditing();
The event cellValueChanged can be catched on your agGrid the type of the
event is CellValueChangedEvent
<ag-grid-angular ... (cellValueChanged)="onCellValueChanged($event)"
</ag-grid-angular>
Regards,
Arnaud.
On Thursday, 23 January 2020 10:02:58 UTC+1, raju bhai wrote:
>
> My project angular version:
>
> Angular CLI: 9.0.0-rc.7
>
> I m working with grid and I want to edit a record. and call a function
> when press the button but console.log is not display?
>
>
> partymastercomponent.ts
>
>
> import { Component, OnInit } from '@angular/core';import { BackendService }
> from '../backend.service';
> @Component({
> selector: 'app-partymaster',
> templateUrl: './partymaster.component.html',
> styleUrls: ['./partymaster.component.css']})export class
> PartymasterComponent implements OnInit {
>
> PartyMstId: any;
> PartyCode: any;
> PartyName: any;
>
> partylist: any;
>
> constructor(public myservice: BackendService) { }
>
> columnDefs = [
> {
> headerName: "Edit",
> field: "icon",
> width: 100,
> //id: this.PartyMstId,
> cellRenderer: function (params)
> {
> return '<button (click)="editfunction()"><i class="fa
> fa-edit"></i></button>'
> }
> },
> { headerName: 'PartyMstId', field: 'PartyMstId', sortable: true,
> filter: true/*, checkboxSelection: true*/ },
> { headerName: 'PartyCode', field: 'PartyCode', sortable: true, filter:
> true },
> { headerName: 'PartyName', field: 'PartyName', sortable: true, filter:
> true },
>
> ];
>
> editfunction() {
> console.log("call this edit function");
> }}
>
> partymastercomponent.html
>
>
> <ag-grid-angular style="width: 1000px; height: 500px;"
> class="ag-theme-balham"
> [rowData]="partylist"
> rowSelection="multiple"
> [columnDefs]="columnDefs"></ag-grid-angular>
>
> how to call a function on edit button click??
>
> icon as well as button is not working??
>
> when I press right click on browser then
>
> <span><button(click)="editfunction()"><i class="fa fa-edit"
> ></li></button></span> browser
>
>
> help??
>
--
You received this message because you are subscribed to the Google Groups
"Angular and AngularJS discussion" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
To view this discussion on the web visit
https://groups.google.com/d/msgid/angular/a18c9e87-aa6d-49ea-8f0b-fc78e75878b8%40googlegroups.com.
