Flexgrid - Custom Editor quick edit and add new

Flexgrid - Custom Editor quick edit and add new

Posted by: pentamic on 14 September 2017, 2:21 am EST

• 

  pentamic

  • Post Options:
  • Link
    Copy
  • Jump To Answer

  Posted 14 September 2017, 2:21 am EST

  Sorry for double topic but I can’t create new topic in customer forum till today. I copied the old question from community forum here

  Hi
  
  I’m using flex grid with custom grid editor like in this sample
  
  http://demos.componentone.com/wijmo/5/Angular/CustomGridEditors/CustomGridEditors/

  The problem is when quick editting, the first character input wasn’t recognized. The editor was created, focused but pass that character.

  And another problem is when add new element using the newItemCreator function and allowAddNew feature of the grid, every time I create a row by clicking the custom editor column, the editor automatic lost focus and close, so I must click again to edit it.

  Please reply are there any solution for this, because I want a better lookup capability for my grid.

  After a few hours digging the code, I found out the reason of the add new problem. Refresh function was called after add new, so I change it to invalidate. Still not sure about the different but it work.
  
  And the problem with the quick edit mode, I think I can fix it if I just know what mode is currently used in the CustomGridEditor beginningEdit function
  
  So please tell me there is a way

• 

  ashishjindal

  • Post Options:
  • Link
    Copy

  Posted 14 September 2017, 2:21 am EST

  Hello,

  I guess now you are able to create post here. For the record, these issues are already escalated it to the development team(124265, 124298) for review.

  Regards

• 

  pentamic

  • Post Options:
  • Link
    Copy

  Posted 14 September 2017, 2:21 am EST

  Any new on this ?
  
  Still waiting for a better eđitting solution for flexgrid

• 

  manpreet-kaur

  • Post Options:
  • Link
    Copy

  Posted 14 September 2017, 2:21 am EST

  Hello,

  Issue ID: 124265, related to the first keystroke getting lost when custom editors are used for editing, has been fixed by the development team. However, the build is still under QA testing. We will let you know as soon as the issue is fixed.

  Issue ID: 124298, related to the edit mode of newly added row seems to be fixed in the latest build of Wijmo 5 i.e. 2015v2.84, which you can download from the following link: http://wijmo.com/products/wijmo-5/.

  Hope it helps.

  Thanks,
  
  Manpreet Kaur

• 

  pentamic

  • Post Options:
  • Link
    Copy

  Posted 14 September 2017, 2:21 am EST

  After update to the latest version, I still have some issues when using custom grid editor with wj autocomplete:
  
  When added new row, the first key stroke was recognized but the character was also selected, so if I continue typing, that character still gone.
  
  The CustomGridEditor doesn’t fire any event, and I don’t know the correct way to fire one ( cellEditEnding, cellEditEnded)
  
  Lastly, I try using the wjFlexGridCellTemplate to using an AutoComplete box when editting but it just doesn’t work. The edit mode close unexpectedly and there are problems with unicode character made the browser jump to previous page.

• 

  manpreet-kaur

  • Post Options:
  • Link
    Copy

  Posted 14 September 2017, 2:21 am EST

  Hello,

  I tried testing this issue by executing the “CustomGridEditors” sample shipped with the latest version of Wijmo 5. I set the allowAddNew property of the FlexGrid to true, so as to add a new row to FlexGrid.

  However, I could observe that as soon as I put the cell in the Amount column of the new row into edit mode, it gives an error. I have attached a screenshot for your reference. Kindly refer to the same. I tried editing the cell by double clicking in the cell as well as directly typing onto the cell after setting the focus on the cell.

  Could you please share a sample application depicting your issue so that I can replicate the issue at my end and debug it further.

  Thanks,
  
  Manpreet Kaur
  
  

• 

  pentamic

  • Post Options:
  • Link
    Copy

  Posted 14 September 2017, 2:21 am EST

  I think you need to implement the newItemCreator function to make that work.
  
  I attach the modified sample project.
  
  Notice that when add new row by typing into the country column, the whole text get selected, so if you continue typing, that character is gone.
  
  2015/10/CustomGridEditors.zip

• 

  manpreet-kaur

  • Post Options:
  • Link
    Copy

  Posted 14 September 2017, 2:21 am EST

  Hello,

  Thank you for providing the sample application. Here are my further observations on this issue:

  1. I was able to replicate the issue related to the first typed character getting selected and lost. I have escalated it to the development team. I will let you know as soon as I get any information in this regard.

  2. I could observe that the cellEditEnded and the cellEditEnding event is not fired when using the custom editors. However, the beginningEdit event is raised correctly. I have escalated it to the development team. I will let you know as soon as I get any information in this regard.

  3. I could not observe any issues while using the AutoComplete as the FlexGrid cell editor created using the wjFlexGridCellTemplate. The Country column cells display an AutoComplete control when put in edit mode and display the selected value from the AutoComplete when the cell comes out of edit mode. Kindly refer to the attached sample which implements the same.

  4. Further, I used the UnicodeInput utility(http://www.fileformat.info/tool/unicodeinput/) to enter unicode characters in the AutoComplete cell. However, I could not observe any issues. The data was correctly entered in the cell and page did not switch to previous page.

  I would suggest you to test the last two issues with the latest build of Wijmo 5 i.e. 2015v2.90, which you can download from the following link: http://wijmo.com/products/wijmo-5/.

  Hope it helps. Please let me know in case the issue persists.

  Thanks,
  
  Manpreet Kaur
  
  2015/10/AutoCompleteTemplate.html

• 

  bernardo

  • Post Options:
  • Link
    Copy

  Posted 14 September 2017, 2:21 am EST

  This is the design behavior. The custom editors take over the editing process so the grid doesn’t get or fire the cellEditEnding or cellEditEnded events.

  You can remove this limitation by modifying the CustomGridEditor class to raise the events on behalf of the grid. This can be done as follows:

  [js]// close the custom editor, optionally saving the edits back to the grid
  
  _closeEditor(saveEdits: boolean) {

  // check that the editor is active
  
  varparent = this._edt.parentElement,
  
  grid = this._grid,
  
  edt = wijmo.Control.getControl(this._edt);
  
  if(parent) {

  // raise grid's cellEditEnding event
  vare = newwijmo.grid.CellRangeEventArgs(grid.cells, this._rng);
  grid.onCellEditEnding(e);
  
  // save editor value into grid
  if(saveEdits && !e.cancel) {
    if(edt != null) {
      if(!wijmo.isUndefined(edt['text'])) {
        this._grid.setCellData(this._rng.row, this._rng.col, edt['text']);
      } else{
        throw'Can\'t get editor value/text...';
      }
      this._grid.invalidate();
    }
  }
  
  // close editor and remove it from the DOM
  if(edt instanceofwijmo.input.DropDown) {
    (edt).isDroppedDown = false;
  }
  parent.removeChild(this._edt);
  
  // raise grid's cellEditEnded event
  grid.onCellEditEnded(e);
  

  }
  
  }[/js]

  Hope this helps.

• 

  pentamic

  • Post Options:
  • Link
    Copy

  Posted 14 September 2017, 2:21 am EST

  Hi
  
  Thank Bernado. Really appreciate your help, I tried firing the event myself once, but I don’t know the proper argument for the constructor so I just past an object with the row and col property. Feel like hacky and I don’t like that. Now I will use your constructor
  
  [js]var e = new wijmo.grid.CellRangeEventArgs(grid.cells, this._rng);[/js]
  
  Thanks again

• 

  pentamic

  • Post Options:
  • Link
    Copy

  Posted 14 September 2017, 2:21 am EST

  Hello
  
  Any news on this issue ?

  “1. I was able to replicate the issue related to the first typed character getting selected and lost. I have escalated it to the development team. I will let you know as soon as I get any information in this regard.”

• 

  manpreet-kaur

  • Post Options:
  • Link
    Copy

  Posted 14 September 2017, 2:21 am EST

  Hello,

  The issue seems to be fixed in the latest version of Wijmo 5 i.e. 2015v3.102. I would suggest you to test the issue with the latest version of Wijmo 5 i.e. 2015v3.102, which you can download from the following link; http://wijmo.com/products/wijmo-5/.

  Hope it helps.

  Thanks,
  
  Manpreet Kaur

• 

  pentamic

  • Post Options:
  • Link
    Copy

  Posted 14 September 2017, 2:21 am EST

  Hi Manpreet Kaur,
  
  No, It has’t been fixed yet.

  I created a fiddle for that issue here:
  
  http://jsfiddle.net/y74o77a1/1/

  Notice the problem when you add new row by typing directly to the country column

• 

  manpreet-kaur

  • Post Options:
  • Link
    Copy

  Posted 14 September 2017, 2:21 am EST

  Hello,

  Thank you for providing the sample HTML Page, I was able to replicate the issue at my end. I have escalated the issue to the concerned team. I will let you know as soon as I get any information in this regard.

  Thanks,
  
  Manpreet Kaur

• 

  johnny-su

  • Post Options:
  • Link
    Copy

  Posted 14 September 2017, 2:21 am EST

  Hello,

  Any updates on this issue about losing the first character?

  Regards,
  
  Johnny

• 

  manish-gupta1

  • Post Options:
  • Link
    Copy

  Posted 14 September 2017, 2:21 am EST

  Hello Johnny,
  
  This issue has been fixed in latest build 5.20171.282 which can be downloaded from here

  For your reference, please see the fiddle that implements the same.

  Thanks,
  
  Manish Kumar Gupta

• 

  himaja

  • Post Options:
  • Link
    Copy

  Posted 15 November 2017, 4:58 pm EST

  Can you please anyone suggest me how to replace thousand separator comma while editing wijmo flexgrid cell editing in angular 2…
  
  with small example

• 

  himaja

  • Post Options:
  • Link
    Copy

  Posted 20 November 2017, 5:15 pm EST

  Error: Template parse errors:↵"let-" is only supported on ng-template elements. (“eadOnly]=“true”>
  
  ↵ <template wjFlexGridCellTemplate [cellType]=”‘Cell’" [ERROR ->]let-item=“item”>

  Above is my error facing with wijmo after upgrading to angular 5 version