jQWidgets Forums
jQuery UI Widgets › Forums › Angular › angularGrid select event
Tagged: angular grid, grid
This topic contains 5 replies, has 3 voices, and was last updated by Peter Stoev 8 years, 8 months ago.
-
AuthorangularGrid select event Posts
-
I’m using the columntype ‘dropdownlist’ in an angularGrid. However, I do not like that the cell value of the grid is updated only after
OnCellvaluechanged
orOnCellendedit
was raised. I want that the cell gets the value immediately after the ‘select’ event of the dropdownlist. I do not know how to achieve that.The columns are created with reference to private createGridEditor and initGridEditor methods. Since I needed more logic anyway in
initGridEditor
I thought I can justeditor.on('select', function(event){ // 'change' also not working if(event.args.type != 'api'){ // TODO: do not know how to end the edit process and invoke OnCellendedit or OnCellvaluechanged since 'this' is not valid for the component } });
Another possible of course would have been to define the event in the html part of angularGrid such as
<angularGrid (OnChange)=test($event)></angularGrid>
but I guess this is not useful since implementation for various editors would have to be overwritten.
Can you advice how to get the desired behavior? Thanks a lot in advance.Hi Bard,
Have you tried using the ES2015 arrow functions?
Insted of
editor.on('select', function(event) {
write
editor.on('select', (event) => {
This way you don`t change the context of THIS so it may refer to the component.
Best Regards,
IvojQWidgets Team
http://www.jqwidgets.com/Hi Ivo,
thanks for trying to help. Changing the function definition is not helping unfortunatly. The problem is, that in this context, “THIS” refers to the grid, not to the component.
editor.on('select', (event) => { if(event.args.type != 'api'){ console.log(this); // c {owner: b.(anonymous function), datafield: 17, displayfield: 17, text: 17, createfilterpanel: null…} this.Cellendedit(event); // Uncaught TypeError: _this.Cellendedit is not a function // this.myGrid.OnCellendedit(event); // Cannot read property 'OnCellendedit' of undefined } });
Do you have another idea how to call
OnCellendedit
right after the select event of the dropdownlist in an jqxgrid is triggered.Best Regards,
MartinHi Martin,
To add my response about the Grid here, too.
this.myGrid within the editor’s select handler is Invalid as the context is not the Grid. You’re trying to override the Grid’s built-in editing logic, but this is not possible and will lead to errors.
Best Regards,
Peter StoevjQWidgets Team
http://www.jqwidgets.comHi Peter,
I appreciate your efforts.
This is sad to hear. But as far as I remember this
$("#jqxgrid").jqxGrid('endcelledit', null, null, false); // not working but sort of like this
workaround was working with Javascript by directly dealing with the DOM structure. However, with angular2 I can get the elementRef or ViewChild for example but cannot call methods for this element in the component. Are you aware of such possibility?Again, thank you very much for your help.
Hi Martin,
If you have the reference to the Grid component like myGrid in some our examples, then you can call any Grid method.
Best Regards,
Peter StoevjQWidgets Team
http://www.jqwidgets.com -
AuthorPosts
You must be logged in to reply to this topic.