Cellhover in Angular?

[morososBlocked]

I would like to use cellhover in jqgrid in Angular, I have seen that in jquery it is like that:

  cellhover: function (cellhtmlElement, x, y) {	
  	element = cellhtmlElement;
    xPos = x;
    yPos = y;
    if (hasCellEdit) {
    	//console.log(cellhtmlElement, x, y);	
    }
  }
});

$('#jqxgrid').on('cellbeginedit', function (event) {
	hasCellEdit = true;
  console.log(element, xPos, yPos);	
});

but how would this be in Angular?

[HristoParticipant]

Hello morosos,

I would like to ask you what is your final goal.
Could you clarify it?
Meanwhile, you could try this example:
https://stackblitz.com/edit/github-jupfmx-thtsrl?file=src/app/app.component.ts
I hope this will help.

Best Regards,
Hristo Hristov

jQWidgets team
https://www.jqwidgets.com

[morososBlocked]

Thank you very much for answering, it already works, Now my goal is that with that information received I can create a jqxtooltip custom in a dynamic way,
Any examples?

Thank you again!.

[morososBlocked]

Right now i have this

cellhover=(element, pageX, pageY)=>{

    
    const toolTipSettings: jqwidgets.TooltipOptions = {
      content: element.innerHTML,
    }
    
    this.myTooltip.createComponent(toolTipSettings);
    this.myTooltip.open(pageX, pageY)
   
  }

<jqxTooltip #tooltipReference></jqxTooltip>

The problem is that it shows me the tooltip but empty, it doesn’t show the text, also if I change the cell it doesn’t restart if I use the function this.myTooltip.close(), any idea?

[HristoParticipant]

Hello morosos,

You could try to use the this.myTooltip.setOptions({ content: "New Content" }); option.
I hope this will help.

Best Regards,
Hristo Hristov

jQWidgets team
https://www.jqwidgets.com

[morososBlocked]

First, thanks again.
It works but it has a strange behavior.

  cellhover=(element, pageX, pageY)=>{
    
    this.mytooltip.setOptions({content: element.innerHTML})
    this.mytooltip.open(pageX, pageY);

  }

If I make a console.log of that element.innerHTML the value is correct but when the tooltip is rendered it shows me the value of the cell of that row that is in the last column, I have changed the order of the columns but I will always open the tooltip with the value of the last column.

[morososBlocked]

In fact, the cellhover function returns each of the cells from the first to the last, so the tooltip always shows me the value (the last one in each row).

It’s rare.

[HristoParticipant]

Hello morosos,

Please, take a look at this example:
https://stackblitz.com/edit/github-jupfmx-rrw4wf?file=src/app/app.component.ts

Best Regards,
Hristo Hristov

jQWidgets team
https://www.jqwidgets.com

[morososBlocked]

Thanks for answering, I’ve been trying for a few days but I can’t get a normal behaviour.

for example, the tooltip should open after X seconds and if I change cells it closes, and wait to open again but the event continues and drags an open tooltlip through all the cells, I have tried different ways, either with functions from the library or some of mine, but not 🙁

[HristoParticipant]

Hello morosos,

Please, provide us with a code example that you try.
You could create a simple example with dummy records.

Best Regards,
Hristo Hristov

jQWidgets team
https://www.jqwidgets.com

[Author]

Posts