How to disable/remove the row header validation & tooltip message?

How to disable/remove the row header validation & tooltip message?

Posted by: khandakartareq.alam on 22 November 2021, 6:31 pm EST

• 

  khandakartareq.alam

  • Post Options:
  • Link
    Copy
  • Jump To Answer

  Posted 22 November 2021, 6:31 pm EST - Updated 3 October 2022, 3:14 am EST

  Hello Support,
  
  There is a requirement to not display the validation error (red mark ) and the validation message on the Row header. The requirement is to show the error mark and validation message only to the cells.

  We are being able to not display the error mark with removing the “wj-state-invalid” class inside the formatItem event.

  However, we are not being able to disable/remove/delete the tooltip on the row header.

  Could anyone help on how to remove the tooltip from the row header?

  Please check the following link and the attachment.
  
  https://www.grapecity.com/wijmo/demos/Core/CollectionView/EditingViews/Validation/purejs

  Thank you.
  
  Regards,
  
  Alam

  

  1359×615 83.9 KB

• 

  sonu.pandey

  

  • Post Options:
  • Link
    Copy

  Posted 23 November 2021, 8:25 pm EST

  Hello,

  You may add mouseover event listener to the FlexGrid hostElement to remove the toolTip element from the DOM when hovered over the rowHeader cells. Please refer to the code snippet and sample link below demonstrating the same:

  
    //
    //remove tooltip from DOM when hovered over rowHeader cells
    theGrid.hostElement.addEventListener('mouseover', onMouseMove(theGrid), true);
    function onMouseMove(grid) {
      var listener = (e) => {
        var hti = grid.hitTest(e);
        if (hti.panel === grid.rowHeaders) {
          setTimeout(() => {
            document.querySelector('.wj-tooltip')?.remove();
          }, 5);
        }
      };
      return listener;
    }
  
  

  Sample link: https://stackblitz.com/edit/js-yamoxn?file=index.js

  Regards

• 

  khandakartareq.alam

  • Post Options:
  • Link
    Copy

  Posted 5 December 2021, 6:38 pm EST

  Hello Sonu,
  
  Apology for my late response and thank you for the demonstration.
  
  I was successfully able to achieve [remove the row header validation & tooltip message].
  
  By the way, in my case it was necessary to use the following line of code:

  document.querySelector('.wj-tooltip.wj-error-tip')?.remove();
  

  Thank you.
  
  Regards,
  
  Alam

• 

  sonu.pandey

  

  • Post Options:
  • Link
    Copy

  Posted 6 December 2021, 3:09 pm EST

  Hello,

  We are glad that you were able to resolve the issue. Thank you for sharing the code snippet.

  Regards