do the calculations using a binded object to a grid property

[Bruno]

is it possible to implement or do such a thing?

I would like the change in the grid html to be reflected in the motion of every property of the object (selecteditem). a binding two way.

because if I have to do complex calculations, I must first take the values of the other cells by reference and it is too cumbersome and dirty. while with a binded object twa way is much cleaner. it's possible?

My Html:

ejs-grid #grid [dataSource] = 'data' [editSettings] = 'editSettings' [toolbar] = 'toolbar' height = '273px' [(selectedItem)] = "recordSelezionato">

                <E-columns>

                    <e-column field = 'CustomerID' headerText = 'Customer ID' width = 120> </ e-column>

                    <e-column field = 'Quantity' headerText = 'Quantity' editType = 'numericity' [edit] = 'totalParams' width = 150> </ e-column>

                    <e-column field = 'Price' headerText = 'Price' editType = 'numericity' [edit] = 'totalParams' width = 150> </ e-column>

                    <e-column field = 'Total' headerText = 'Total' textAlign = 'Right' editType = 'numericity' [edit] = 'totalParams' width = 120 format = 'C2'> </ e-column>

                </ E-columns>

                </ Ejs-grid>

My Ts:

public recordSelezionato: CorpoDocumento;

 ngOnInit (): void {

        this.data = data;

        this.editSettings = {allowEditing: true, allowAdding: true, allowDeleting: true};

        this.toolbar = ['Add', 'Edit', 'Delete', 'Update', 'Cancel'];

        this.totalParams = {params: {change: this.totaliRiga.bind (this)}};

    }

 totaliRiga (args) {

     recordSelezionato.Total = recordSelezionato.Price * recordSelezionato,Quantity

    }

so automatically the html also updates me.

[Dhivya Rajendran]

Hi Bruno,  

 

We have analyzed your query, Here I have modified the sample, In the below sample we have PriceUpdate() and totalUpdate() method to update the total and price value. If you change the quantity as well as price in that case you can only update the total value itself. So you can use totalUpdate() method for both the cases . We have set the field value through the field object , it’s the best way to update the value dynamically in Grid. Here I have mentioned the code snippet and plunker link as below,  

 

@Component({  

    selector: 'app-container',  

    template: `<ejs-grid #grid  [dataSource]='data' [editSettings]='editSettings'[toolbar]='toolbar' height='273px'>  

                <e-columns>  

                 . . . . .     

                </e-columns>  

                </ejs-grid>`   

})  

export class AppComponent implements OnInit {  

     . . . . . .   

      priceUpdate(args){  

      let quantity=this.grid.element.querySelector('#'+ this.grid.element.id + 'Quantity').value;  

      let price=edit.querySelector('#'+ this.grid.element.id + 'Price').ej2_instances[0];        

      price.value = args.value / quantity; // calculate price value  

    }  

      

     totalUpdate(args){  

      let quantity=this.grid.element.querySelector('#'+ this.grid.element.id + args ).value;      let total=this.grid.element.querySelector('#'+ this.grid.element.id + 'Total').ej2_instances[0];   

      total.value = arguments[1].value * quantity; // calculate total value  

    }  

      

    ngOnInit(): void {  

        . . . . .   

        this.totalParams = { params: {change: this. priceUpdate.bind(this) } };  

        this.priceParams = { params: {change: this. totalUpdate.bind(this, ‘Quantity’) } };  

        this.quantityParams = { params: {change: this. totalUpdate.bind(this, ’Price’) } };  

    }  

}  

 

Could you please provide the below information, it will be more helpful for us to provide a better solution as soon as possible.  

1.      Do you want to calculate the total or price value for all columns(Ex: 20 columns). 

2.      could you please share, What do you want to expect in two way binding? 

Plunker sample link: http://plnkr.co/edit/pBlWTJVsDMyxxGLyjnFM?p=preview  

Regards,
R.Dhivya