Hyperlinks in Ext.grid.Panel

[robert-vogel]

Hello everybody!

I want to create complex markup within a grid cell using the 'renderer' callback of a column. This markup also contains several normal hyperlinks. When I click on one of the hyperlinks the only the "select" event of the grid gets fired but the default behavior of the hyperlink (open the target in same window) is being prevented.
I've already seen that people suggest to listen to the 'cellclick' event of the gird but it doesn't get fired. I've already grepped the source code but I did not find any place where ExtJS actually fires 'cellclick'.
The strange thing is, that I'm sure I've seen this working somewhere else. Can anyone help?

Im using ExtJS 4.2.1.883

--
Robert Vogel

[Gary Schlosberg]

Here's an example grid that has hyperlinks in it:
http://docs.sencha.com/extjs/4.2.1/#...te-scroll.html

[skirtle]

The cellclick event is fired here:

http://docs.sencha.com/extjs/4.2.1/s...ocessItemEvent

The prefix 'cell' is appended to the start of the browser event name, so searching for 'cellclick' won't find it.

This event is fired on the grid view. The grid panel then uses relayEvents to pass it on.

[robert-vogel]

Thanks for the very quick response!

I've got hyperlinks in grid cells working in other places of my application. But in all cases it is just one hyperlink in one cell.

The current issue occurs when I have more than one link in a cell. I've created a little fiddle for my case: https://fiddle.sencha.com/fiddle/npi [1]

You need to type "Orga" into the search field so the picker shows a list of hits. Then you can click on "Target X" link on the first hit to see what happens. It should open a new browser window with the address of the link. But instead just the 'select' event of the grid is being fired.

I've registered several 'cellclick' handlers (to the grid panel itself and the table view) but none of them gets called.

I have to admit that I'm using a third party component called "Ext.ux.form.field.GridPicker", so maybe the issue I'm facing is related to that. Maybe it's because the grid is the picker of a combobox?

---

EDIT:
[1] It seems that the fiddle tool does not save the order of the files. Therefore a error might occure if Ext.ux.form.field/GridPickerKeyNav.js is below Ext.ux.form.field/GridPicker.js. To fix it, please just change order of the two files in the ressources panel.

[robert-vogel]

The cellclick event is fired here:
The prefix 'cell' is appended to the start of the browser event name, so searching for 'cellclick' won't find it.
This event is fired on the grid view. The grid panel then uses relayEvents to pass it on.

Thanks for this hint. I've debugged the function and it seems that 'click' never gets fired but 'mousedown' does. I've also looked at "processUIEvent" method of Ext.view.View. No "click" event ever arrives...

[skirtle]

I have to admit that I'm using a third party component called "Ext.ux.form.field.GridPicker", so maybe the issue I'm facing is related to that. Maybe it's because the grid is the picker of a combobox?

I suggest extracting a test case that doesn't involve the GridPicker.

[robert-vogel]

I've tried now with a normal grid. Cellclick does work. And even more important: multiple hyperlinks in one grid cell do work.

I still have no idea why "Ext.ux.form.field.GridPicker" does not work. It just uses a grid as picker of a combobox. Maybe it has something to do with "onItemClick" method of combobox...

I'll give you an update as soon as I know more.

[robert-vogel]

Okay, in a normal Grid multiple links do work. It has to be the use of the grid as a picker within the combobox. The select event seems to overweight.

:| Any ideas on this? Did somebody else ever implemented a more complex picker of a combobox? One where more than one link per item was included?