Enterprise-ng: Lookup: In multiselect we are getting array of string instead of array of object

[dhumalkishor]

Describe the bug
In lookup control we are getting array of string instead of array of object when we select more than 6 records.

We have forked and made our changes in https://github.com/JangleShubham/enterprise-ng
Please install this project and run it and go to the path http://localhost:4200/ids-enterprise-ng-demo/lookup.

To Reproduce
Steps to reproduce the behavior:

1. Go to 'Open lookup multiselect under label "Products (Async Results) Multi Select"'
2. Popup with grid will get open, apply for filter and select one value, repeat this until we select at least 3 values.
3. After close at console we have logged selected records, and those records should be array of object but instead we are getting array of string.

Expected behavior
It should provide array of object.

Version

• ids-enterprise-ng: [e.g. v4.9.0 or v4.10.0]

Screenshots
If applicable, add screenshots to help explain your problem.

Platform

• Device (if applicable) [e.g. iPhone 6 or Samsung Galaxy S6]
• OS Version: [e.g. Windows 10 or iOS 8]
• Browser Name [e.g. chrome, safari, stock browser]
• Browser Version [e.g. 22, 66.0.3359.181 (Official Build) (64-bit)]

Additional context
As we deals with ids and because if this issue when we get array of string we can't get id assigned to object.

[tmcconechy]

I dont think we can change this at this time. The Dirty event is just firing and giving you the string thats in the lookup field. That cant handle objects.

try watching the change event instead...

this.element.val(value.join(this.settings.delimiter)).trigger('change', [this.selectedRows]);

I think this should give you the selectedRows object. Feel free to close if that works.

[JangleShubham]

Hello Tim,

We are using change event already, please see URL: https://github.com/JangleShubham/enterprise-ng/blob/master/src/app/lookup/lookup.demo.html#L218
Please take latest code of https://github.com/JangleShubham/enterprise-ng.git and see, we have commented dirty and pristine events but still we are getting same output in console.
Please let us know if we are doing something incorrect.

Thanks,
Shubham Jangle

[tmcconechy]

I think the only thing "incorrect" is you dont use unique ID's so you cant use the value as a string. I did think that the change event would have objects but i was wrong...

What about using the selected event?

https://github.com/infor-design/enterprise-ng/blob/master/src/app/lookup/lookup-dialog.demo.html#L4
https://github.com/infor-design/enterprise-ng/blob/master/src/app/lookup/lookup-dialog.demo.ts#L34

?

[JangleShubham]

Hello Tim,
https://github.com/infor-design/enterprise-ng/blob/master/src/app/lookup/lookup-dialog.demo.html#L4
https://github.com/infor-design/enterprise-ng/blob/master/src/app/lookup/lookup-dialog.demo.ts#L34
This event seems to be of DataGridView, can you please suggest us how to use it in lookup multiselect?
Thanks,
Shubham Jangle

[tmcconechy]

Hmm yes your right. This example i think is just "left out" and shows datagrid. Im not seeing a selected event you can access on the lookup. But you can try to get to the underlying example maybe.

Perhaps a solution here is to expose the selected event in the datagrid to the lookup. This will require some work we will have to schedule down the line. Perhaps you can find a workaround meanwhile on your end (using strings). I'm out of ideas than that for the moment

[katieinfor]

@dhumalkishor Can you please tell us what team you're on? Thanks!

[dhumalkishor]

Infor GRC

[dhumalkishor]

Hi Tim,

Can you please let me know when we can expect this issue will get fix? One of the our customer is waiting for this.

Regards,
Kishor

[tmcconechy]

I can try and add it to next version but we are moving to quarterly releases so will be end of Q3. I think a possible fix is to use the settings we added as intended. i.e.

Set the field and the match option https://github.com/infor-design/enterprise/blob/main/src/components/lookup/lookup.js#L916

https://github.com/infor-design/enterprise/blob/main/app/views/components/lookup/test-custom-matching.html#L50-L53

I think you might be able to just use that. If you can put the example up in a stack blitz https://stackblitz.com/edit/ids-quick-start-950 fork i can fork it and try it out for you.

Here is the running example: https://main-enterprise.demo.design.infor.com/components/lookup/test-custom-matching.html

[dhumalkishor]

In which version we get above mentioned code?

[tmcconechy]

Any version.. Been there for a long time. https://github.com/infor-design/enterprise-ng/blob/main/projects/ids-enterprise-ng/src/lib/lookup/soho-lookup.component.ts#L230

[JangleShubham]

Hello Tim,

We checked with latest SOHO version and tried with stackbliz code you shared.
We are getting results in array now but we have found three issues with it as below:

1. Shows all records selected if duplicate field is same
   Steps:
   i. Go to page https://ids-quick-start-950-wqyk9n.stackblitz.io/lookup
   ii. Click on "Soho miltiselect issue" lookup
   iii. Select any two records of column"Application Instance Name" named "Soxtest" and click Apply
   iv. Again, click on same lookup, you will find all records named "Soxtest" are selected
   Expected: Records selected in steps iii should only be selected in step iv. you suggested match function, how can we use it here?

2. Shows all records selected on second page:
   steps:
   i. Go to page: https://ids-quick-start-950-wqyk9n.stackblitz.io/lookup
   ii. Click on "Soho miltiselect issue" lookup
   iii. Select any two records and click on next page button of pagination
   iv. At second page, you will find all records are selected
   Expected: Only earlier selected records should show selected, (if no records then no records should be selected).

3. Removes already selected entries if we don't visit selected record page:
   steps:
   i. Go to page: https://ids-quick-start-950-wqyk9n.stackblitz.io/lookup
   ii. Click on "Soho miltiselect issue" lookup
   iii. Go to second page and select any two records and click Apply.
   iv. Again click on same lookup and click on Apply without visiting second page.
   v. Selected Records from page two will not be there in the list showed below lookup.
   Expected: Whether user travels the page of record or not lookup should return those records as well.

If there is some turnaround for all this please let us know.

Thanks,
Shubham Jangle

[tmcconechy]

Did you checkout the match example? Basically it's just a function that you set the code in the settings it runs when trying to find the selected items.
https://github.com/infor-design/enterprise/blob/main/app/views/components/lookup/test-custom-matching.html#L54

Is it possible to make a very simple example that just shows the problem (seems like a lot in this one and im not sure where the code is?)

My other suggestions/ideas would be to use a unique key here for matching. Or maybe even use the multiselect https://master-enterprise.demo.design.infor.com/components/multiselect/example-index.html

[JangleShubham]

Hello Tim,

Thanks for the suggestion, we tried match function and used one more column for matching data.
But following issues are there that we noticed, can we use any property or function to resolve those issues?
Issues noticed are as follows:

Issue One: Is same as 3rd one noticed in my previous comment is still there even after using match function.
Removes already selected entries if we don't visit selected record page steps::

1. Go to page: https://ids-quick-start-950-wqyk9n.stackblitz.io/lookup
2. Click on "Soho multiselect issue" lookup
3. Go to second page and select any two records and click Apply.
4. Again click on same lookup and click on Apply without visiting second page.
5. Selected Records from page two will not be there in the list showed below lookup.
   Expected: Whether user travels the page of record or not lookup should return those records as well.

Issue Two: Selected records doesn't appear selected steps:

1. Go to page: https://ids-quick-start-950-wqyk9n.stackblitz.io/lookup
2. Click on "Soho multiselect issue" lookup.
3. Select any two records from first page, then select any two from second page and select any two from third page and click on Apply.
4. It will show 6 records selected as expected, but when you open lookup again and visit second page and then third page it will not show selected records of third page.
5. Also after you click Apply, records from only first page is there in the selected list which is iterated below lookup.
   Expected: Records from all pages should be visible selected after reopening lookup.

We have updated code on below link:
https://stackblitz.com/edit/ids-quick-start-950-wqyk9n

Please verify and let us know if there is any mistake we are doing.

Thanks,
Shubham Jangle

[dhumalkishor]

Hi Tim,

We can't use multiselect in GRC because we have more than 500 records and it will be difficult for user to find the records which they want to select.

Regards,
Kishor

[tmcconechy]

OK this issue seems like its going to be difficult to resolve due to your ID requirements. We will have to schedule some time for it next sprint for further deeper investigation. We might have to introduce some sort of a fix / setting but not sure how that would look.

You probably could use multiselect with 500 records if you wanted to because you can type to search. But im at a loss for other workarounds for you. I'm not seeing any obvious solutions other than those.

[tmcconechy]

To the person that picks this up - just focus on finding a solution to make https://github.com/infor-design/enterprise-ng/issues/986#issuecomment-842336527 work.

[tmcconechy]

Just a brief update.
We located the issue and have a simpler example. I think to fix this we will expose two events 'selected' and 'afterpaging'. With that you should be able to save the selected row's id somehow and then restore them for the page on after paging.

This whole problem is because your using a field that is not unique. So one workaround to get this working now is to change the grid to use field: 'id'. I dont suppose that would work good enough for you?

Other workarounds are:

• making the field unique even if its the key or not
• not using serverside paging, using client side paging instead and not using selectAcrossPages

If you think about it there is no way for it to find on the current page what to select if its not unique but the new events should give a way. Will push this soon.

[dhumalkishor]

Hi Tim,

We have field ID's unique for each field. Not sure about using client side pagination because we have thousands of records so it may impact on performance side.

Regards,
Kishor

[tmcconechy]

It should still be pretty fast with 1000s with client side paging. But regarding ID's what i mean is you can show the id in the field not the applicationInstanceName which is not unique. Then it works.

Nonetheless im adding two events so you can make this work but it is quite a bit more code for you to make it work with non unique values in the field. Will push it soon

[tmcconechy]

@dhumalkishor this should be working now. we had to add an example with NON unique ids in the field.

I still think you should use the component as intended but we exposed afterpaging and selected and allowDuplicates so you can store your own ID's and it it manually.

See the new example:
https://github.com/infor-design/enterprise-ng/blob/main/src/app/lookup/lookup-desc.demo.ts
https://github.com/infor-design/enterprise-ng/blob/main/src/app/lookup/lookup-desc.demo.html

You can do it this way or you could just use field: 'id' which would have worked before. Hope this helps 👍🏻

Also these events are in 10.2.0 and 4.53.2

[JangleShubham]

Hello @tmcconechy ,

Thanks for the extra events to handle this. It seems to be working.
However we found one small issue. When there is single record selected and we unselect that record then at that time selected event does not get invoke.
This results variable previouslySelectedRows contains that one last value even after deselecting all the values.
As we need results in object format, so we need variable previouslySelectedRows for further operations as per business requirements.

Thanks,
Shubham Jangle

[dhumalkishor]

Hi Tim,

We found one more issue with multiselect lookup. Please refer below steps to reproduce the same.

1. Go to "http://localhost:4200/ids-enterprise-ng-demo/lookup-desc"
2. Click on browse button and select first record of the first page
3. Go to 2nd page and select first records and click on Apply.
4. Now again click on browse button and uncheck the first page record and click on apply button.
5. See both records are got removed.

It should remove only one record.

Regards,
Kishor

[tmcconechy]

@deep7102 do you want to look into these two cases or should I? Thanks

[tmcconechy]

No not yet needs to be investigated by one of us. Since i can connect very well right now can you have a look? Ideally we just can update the example and make it work