Select events return entire object instead of just dataValue?


#1

Might have asked about this before, but the issue keeps returning.

Is it possible to return the whole object and not just the dataValue part of it in some of the events for the select component? Especially the onSet event and onItemTap.

It just seems a little bit wasteful that the component itself loops over the array to list it, and then I have to loop over the list yet again after selecting/tapping them because I want to access some of the other properties inside the very same object.

I really hope there could be a way to include this in a coming release :slight_smile:


#2

Hi there, thanks for the suggestion, that would be indeed a useful feature. This is on our list to implement, but I cannot promise it will make it into the next release - it might seem trivial, however due to component inheritance it’s not as straight forward to do it. The Select component has indeed all the info of the selected object, but the events (onSet, onItemTap) are triggered from a lower level component which does not know about this. Of course this can be solved, but needs some planning.

Meanwhile the recommended solution is to create a map object, which lets you easily find the selected object based on the value. E.g.:

var data = [
  {text: 'George Costanza', value: "c1-1", group: 'Company 1', phone: 5551239},
  {text: 'Elaine Marie Benes', value: "c2-1", group: 'Company 2', phone: 5558349},
  {text: 'Helen Seinfeld', value: "c2-2", group: 'Company 2', phone: 5551312},
  {text: 'Morty Seinfeld', value: "c2-3", group: 'Company 2', phone: 5553455},
];

var dataMap = {};

data.forEach(function (v) {
  dataMap[v.value] = v;
});

mobiscroll.select('#select', {
  data: data,
  group: true,
  onItemTap(event, inst) {
    // Log selected object
    console.log(dataMap[event.value]);
  },
});

Best,
Isti