Currently all dropdown menus are unpaginated in ERM so we need a component to provide the ability to have a searchable select dropdown to limit results loaded by the page on render. Currently bug 32474 (Ajax based inifinite scrolling) is proving problematic so a search based dropdown is the best interim solution. Infinite scrolling can be merged into this when the scroll bump has a fix.
Created attachment 155545 [details] [review] Bug 34762: Add a SearchSelect component to ERM This patch adds an ajax based searchable dropdown component to ERM that can be used throughout the module. It can be configured to work with different parts of the API client This patch contains examples using the erm-api-client and the acquisitions-api-client. You can also customise the amount of characters required to trigger a search, this test plan will show two examples Test plan: 1) Create at least two licenses and agreements in the erm module 2) In Agreements, click New agreement and add an Agreement name and a Status (the required fields) 3) In the Vendor dropdown, you should be prompted to type at least one character to search 4) Search for a vendor in your koha system 5) The results should populate with that vendor 6) Select that vendor 7) Scroll down to Licenses and click add new license 8) In the License dropdown you should again be prompted to type at least one character 9) Search for one of the licenses you created earlier - it should be returned as an option in the dropdown 10) Select the license and add a status 11) Scroll to Related agreements and click to add a new one 12) This time you should be prompted to type two characters to search 13) Search for one of your agreements, you should not receive any results until two characters are provided 14) Select the agreement returned and add a relationship as well 15) Submit the form, the agreement should be saved (provided you have filled in all required fields) 16) In the list of agreements, click on your newly created agreement. It should have a vendor, license and related agreement associated with it 17) Sign off!
Created attachment 155546 [details] [review] Bug 34762: Add a SearchSelect component to ERM This patch adds an ajax based searchable dropdown component to ERM that can be used throughout the module. It can be configured to work with different parts of the API client This patch contains examples using the erm-api-client and the acquisitions-api-client. You can also customise the amount of characters required to trigger a search, this test plan will show two examples Test plan: 1) Create at least two licenses and agreements in the erm module 2) In Agreements, click New agreement and add an Agreement name and a Status (the required fields) 3) In the Vendor dropdown, you should be prompted to type at least one character to search 4) Search for a vendor in your koha system 5) The results should populate with that vendor 6) Select that vendor 7) Scroll down to Licenses and click add new license 8) In the License dropdown you should again be prompted to type at least one character 9) Search for one of the licenses you created earlier - it should be returned as an option in the dropdown 10) Select the license and add a status 11) Scroll to Related agreements and click to add a new one 12) This time you should be prompted to type two characters to search 13) Search for one of your agreements, you should not receive any results until two characters are provided 14) Select the agreement returned and add a relationship as well 15) Submit the form, the agreement should be saved (provided you have filled in all required fields) 16) In the list of agreements, click on your newly created agreement. It should have a vendor, license and related agreement associated with it 17) Sign off!
Created attachment 155547 [details] [review] Bug 34762: DO NOT PUSH: Example usage commit This commit loads the SearchSelect component into three locations as an example for the test plan and should not be pushed
Created attachment 155549 [details] [review] Bug 34762: DO NOT PUSH: Example usage commit This commit loads the SearchSelect component into three locations as an example for the test plan and should not be pushed Signed-off-by: Émily-Rose Francoeur <emily-rose.francoeur@inLibro.com>
Created attachment 155620 [details] [review] Bug 34762: Add a SearchSelect component to ERM This patch adds an ajax based searchable dropdown component to ERM that can be used throughout the module. It can be configured to work with different parts of the API client This patch contains examples using the erm-api-client and the acquisitions-api-client. You can also customise the amount of characters required to trigger a search, this test plan will show two examples Test plan: 1) Create at least two licenses and agreements in the erm module 2) In Agreements, click New agreement and add an Agreement name and a Status (the required fields) 3) In the Vendor dropdown, you should be prompted to type at least one character to search 4) Search for a vendor in your koha system 5) The results should populate with that vendor 6) Select that vendor 7) Scroll down to Licenses and click add new license 8) In the License dropdown you should again be prompted to type at least one character 9) Search for one of the licenses you created earlier - it should be returned as an option in the dropdown 10) Select the license and add a status 11) Scroll to Related agreements and click to add a new one 12) This time you should be prompted to type two characters to search 13) Search for one of your agreements, you should not receive any results until two characters are provided 14) Select the agreement returned and add a relationship as well 15) Submit the form, the agreement should be saved (provided you have filled in all required fields) 16) In the list of agreements, click on your newly created agreement. It should have a vendor, license and related agreement associated with it 17) Sign off! Signed-off-by: Émily-Rose Francoeur <emily-rose.francoeur@inLibro.com>
Thanks for signing off! Just added the sign-off line to the second commit as well
I really don't like to have to type at least two characters to get the list of what I want to see displayed immediately when I open the dropdown list. For me it's a big no, it's a really irritating behaviour.
for short lists of options, I can see this being an irritating extra step, but for longer lists, the lag of loading makes the page unusable for a period of time. What about a compromise? If the list of options is < X records, for some reasonable value of X, show it in it's entirety, but if it's >= X, use the SearchSelect component.
We need to fix the funky behaviours of bug 32474. IMO it's the best option.
*** This bug has been marked as a duplicate of bug 32474 ***