Unable to bind any events to the custom cell type

Unable to bind any events to the custom cell type

Posted by: sathwik.kotla on 29 August 2022, 4:36 am EST

• 

  sathwik.kotla

  • Post Options:
  • Link
    Copy

  Posted 29 August 2022, 4:36 am EST

  I am unable to bind any of the event listeners such as EditChange and EditEnded.
  
  Please refer to the following sample project.
  
  features_cells_cell-types_custom_React_2022-08-29T08_34_53.521Z.zip
  
  Thanks and regards
  
  Sathwik

• 

  avinash.pathak

  • Post Options:
  • Link
    Copy

  Posted 30 August 2022, 6:45 am EST

  Hi,

  thanks for the sample. We found that editchange is not fireing but edit ended is getting fired properly,

  The issue is you are using a custom cell type and you are creating your own custom element for editing that is why spreadJS is not aware of the changes that are being made. You may need to craete some custom event and fire it inside the input elemtn that our implementing.

  Please refer to the following code snippet and let me knwo if you face any issues.

  FullNameCellType.prototype.createEditorElement = function () {
      var div = document.createElement("div");
      div.setAttribute("gcUIElement", "gcEditingInput");
      div.style.backgroundColor = "white";
      div.style.overflow = "hidden";
      var span1 = document.createElement('span');
      span1.style.display = "block";
      var input1 = document.createElement("input");
      input1.id = "gcEditor";
      
      input1.addEventListener("keydown", (e) => {
  [b]       //fire you custom event here to notify the edit change[/b]
          console.log("edit change")
      })
      var type = document.createAttribute('type');
      type.nodeValue = "text";
      input1.setAttributeNode(type);
      div.appendChild(span1);
      div.appendChild(input1);
      input1.focus()
      return div;
  };
  

  Regards,
  
  avinash