Data tabe onSelect doesn't return the row number or other data?

i have a data table (inside of a style box, in case that matters).
the following function is being called when on select fires:

exposed function locationLineSelected()
	var event : object
	var myForm : 4D.WebForm

	myForm=webForm
	event=webEvent
	//componentRef=event.caller

	myForm.setMessage("Clicked row "+event.data)

i don’t seem to be getting the event info, which i think should include the row number.

FYI, clicking on a row does change the hilited row.

looks like onClick does return row/column, but onSelect does not.

Hello Mikey,

You should call the function as an “onCellClick” event.

image

And as a result, when you debug it, the data collection returns its objects including the number of the selected row.

Best regards.

that is what i resorted to doing. so what is onSelect supposed to be used for/what data can it access?

The event “onSelect” allows you to select a row from the data table and manipulate the informations of that row.
For example, when you select a row, you can show it or manage it with data sources in a webform loader, or in a modal or a panel in the same webform.

if you look at my first screenshot, though (look at the expression pane screenshot), you can see that inside of the event, there is no information from the row.

in the first screen the event is onSelect and to get the row & index in the data you should use onCellClick

how else do you select a row, besides clicking on it?

Well, the onClick event of a datatable is slightly different from onSelect.
For example, clicking the header of a datatable will trigger the onClick event, but won’t trigger an onSelect event.

onSelect really is triggered when a row is actually selected after clicking in the datatable.

Another similar event, but different, is the datatable current element / onChange event, that is triggered every time the current element changes (such change can occur in another datatable of the same page, or by coding, not necessarily after a selection or click in the datatable).

Hope this helps

what i’m trying to understand is what the purpose/use case is of onSelect, because at least as far as i can tell from my expression pane (see the first post), there isn’t any information to be gleaned from it.

Let’s suppose you have a datatable bound to an Entity Selection ES and a current element CE. The table just lists elements and you want to show details on another page. You can use onSelect to trigger a navigation event to the details page.

Another use case: you want to select elements in a list to add them in another list. Then you use onSelect to add the current element to another list.

it sounds like this is more of a limited use-case than onClick, then, correct?

As I said, onClick is different. It represents a user click anywhere in the component (here, a datatable). It will be triggered event if the user clicks on the table header, thus selecting nothing. Technically speaking, onClick does not guarantee that the datatable selected element actually took the value of the clicked row when it is triggered.

So if your event uses the datatable selected element as parameter, you’d rather use onSelect or datasource.onChange than onClick.
If your event does not rely on the datatable selected element, you can use onClick safely.

To summarize, those events are not triggered the same way:

  • component.onClick: triggered by a click anywhere in the component. The selected element (in case of a datatable or matrix or selectBox) may have changed or not, it has no importance.
  • datasource.onChange: triggered by the fact the datasource has changed.
  • datatable.onSelect or matrix.onSelect or selectBox.onSelect: triggered by the actual selection of a new element in the component.

when i’m testing, onClick does not trigger if i click in a header. onHeaderClick does, but i don’t think that’s your main point, here.

What do you mean the “selected element”? i don’t see anything other than the component name

I mean the one you set in the UI for the datatable:

image

And that you can retrieve server side by setting an event (here an onSelect):

image

1 Like