Wijmo grid - switch to quick mode from angular code

Wijmo grid - switch to quick mode from angular code

Posted by: rafal.lukaszuk on 22 January 2023, 11:42 pm EST

• 

  rafal.lukaszuk

  • Post Options:
  • Link
    Copy
  • Jump To Answer

  Posted 22 January 2023, 11:42 pm EST - Updated 22 January 2023, 11:51 pm EST

  It is possible to back to quick mode by using some function in angular code?

  We have a situation where the data for our table is recalculated by an external service after editing one cell. When we receive data for a previously edited cell and we are already in a new cell, the new data is provided to the table but we are ejected from editing the cell as a result.
  
  In code we listening on this event and we can stay in edit mode but table change that mode to deep mode and pen disappear.

  We have tried with grid.startEditing(false) but received the same result, nothing changed.

  Example of code:

  onGridCellEditEnding(e: CellEditEndingEventArgs): void {
          if (newDataProcessing === true) {
              const selection = this.grid.selection;
              this.grid.setCellData(selection.row, selection.col, this.grid.activeEditor.value);
              e.cancel = true;
              e.stayInEditMode = true;
              return;
          }
  … other actions
   }

  

• 

  manish.gupta

  

  • Post Options:
  • Link
    Copy

  Posted 27 January 2023, 2:49 am EST

  Hi Rafal,
  
  Thank you for being so patient. To do the required you have to add handlers to the cellEditEnding and refreshed event of the FlexGrid. In the handler of refreshed event, you can call the startEditing() method of the FlexGrid to restore the current cell in the editing mode. In the attached sample I have used the setTimeout() method to set the data after some specific time which represents the delay in the updation of the data from your external service. You can call the data update logic at line number 64 in the file app.component.ts in the attached sample.

  Regards,
  
  Manish Gupta

  Restore_edit_mode_for_appropriate_cells.zip

• 

  rafal.lukaszuk

  • Post Options:
  • Link
    Copy

  Posted 30 January 2023, 12:48 am EST - Updated 30 January 2023, 12:53 am EST

  Thanks for answer but this doesn’t help me with problem.
  
  Here is a example with our case what we have

  https://jscodemine.grapecity.com/sample/1dnN5qJsyE_Rim_kt4LS7w/

  So if you will change value in first row for sales and hit enter then start editing next one and wait until new data comes in you will be kick off from editing and selection will be change.

  Our goal is stay in cell until finish editing without changing the edit model for that cell. I mean we want stay in quick edit mode.wijmo-angular_9885b8_2023-01-30 (2).zip

• 

  manish.gupta

  

  • Post Options:
  • Link
    Copy

  Posted 31 January 2023, 9:48 pm EST

  Hi,
  
  In the previously provided sample, we used the StartEditing() method with the first parameter with true value that keeps the cell in full edit mode. To put the cell in quick edit mode, please set it to false.
  
  Please use the following code snippet for reference:

   flex.updatedView.addHandler((sender, args) =>
          {
              if (this.alreadyInEditMode)
              {
                  flex.setCellData(this.alreadyEditingRow, this.alreadyEditingColumn, this.parseFloatData(this.originalValue));
                 flex.startEditing(false, this.alreadyEditingRow, this.alreadyEditingColumn);
                  this.alreadyInEditMode = false;
              }
          });

  Regards,
  
  Manish Gupta

• 

  rafal.lukaszuk

  • Post Options:
  • Link
    Copy

  Posted 31 January 2023, 10:23 pm EST

  Hi, this doesn’t works.
  
  I have created similar case what we have in our app with that functions and hooks. We have a specific case to update data in grid:

  ngOnChanges(changes: SimpleChanges): void {
          if (changes && changes.data) {
              //This is importat line, we did update of data in this way.
              this.gridData.sourceCollection = this.data;     
          }
      }

  And I think this breaks something in wijmo grid.
  
  I have attached that code example with our case. If you could check that then you will see what I mean.
  
  https://jscodemine.grapecity.com/sample/1dnN5qJsyE_Rim_kt4LS7w/
  
  wijmo-angular_9885b8_2023-02-01.zip

• 

  brzozowski.m24

  • Post Options:
  • Link
    Copy

  Posted 8 February 2023, 8:08 pm EST

  Hi, any update on this topic? I’m facing the same issue and looking for solution.

• 

  manish.gupta

  

  • Post Options:
  • Link
    Copy

  Posted 12 February 2023, 4:35 am EST

  Hi,
  
  Thank you for sharing the sample and your use case. As per your requirement, we have modified the sample shared by you as per your use case. In the modified sample, mainly the events related to cell editing is used to make the cell remain in edit mode while data is updated by background service.
  
  Please refer to updated sample for reference:
  
  https://jscodemine.grapecity.com/share/kLVNvTNHgUSXYFao9olxCw

  Regards,
  
  Manish Gupta

• 

  rafal.lukaszuk

  • Post Options:
  • Link
    Copy

  Posted 19 February 2023, 6:39 pm EST - Updated 19 February 2023, 6:44 pm EST

  Hi,

  Thanks for that example it was really helpful but I faced with another problem with delete values for selected cell range. I have added console log to yours example and selected a range of cells and then hit delete button. The result of that is grid only raised the dataChange output onces and the chain of event for cell started in same time.

  Is there any event to listing on whole grid update?

  I attached a gif with that situation.

  

• 

  manish.gupta

  

  • Post Options:
  • Link
    Copy

  Posted 22 February 2023, 9:11 pm EST

  Hi Rafal,
  
  We are able to replicate the issue at our end. To assist you better, could you please share your use case for editing cells and updating the Data in FlexGrid covering the following points?

  1. Completed SourceCollection updation requirement instead of the particularly affected rows.

  2. The server calls to fetch data from the server after processing or validation.

  3. The current approach would not work for fast data changes.
     
     For e.g,
     
     The first Cell is changed and the request is made to the Server.
     
     The request is still with the Server and another cell change is made

  Example: Multiple cells content deletion.

  So if you would share your use case, we would try to provide the proper solution to your problem.

  In case you would not like to share your use case here publically, you may share it using our private portal.
  
  https://www.grapecity.com/my-account/my-support

  Please create a case there referring to this case and we would try to provide the solution as per your use there.

  Regards,
  
  Manish Gupta