edcarroll / ng2-semantic-ui

Semantic UI Angular Integrations (no jQuery)
https://edcarroll.github.io/ng2-semantic-ui/
MIT License
615 stars 223 forks source link

feat(select): Add ability to paginate remote select results #130

Open genuinefafa opened 7 years ago

genuinefafa commented 7 years ago

Bug Description:

I'm using a sui-select taking advantage of the Search Selection Lookup (Advanced) described in the docs.

Since my results can be pretty huge, I'm in need for an event or something like that so it is possible to continue loading after the user reaches close from the end of current results (my API return batches of N options). This is something that select2 does and it is something useful.

Also, a loading icon might be a good cosmetic addition with close to zero-effort, according to @edcarroll. :smirk:

Link to minimally-working plunker that reproduces the issue:

This is mostly a request/question, so no plunker feels necessary.

Versions:

Angular: 4.1.3 ng2-semantic-ui: 0.8.4 Semantic UI: 2.2.10

edcarroll commented 7 years ago

To clarify, are you meaning for this to act like a sort of pagination for the results?

genuinefafa commented 7 years ago

That's right. As in, my lookup brings: 10 items and total amount of results, it also support request with a starting position.

Kinda pagination right.

On Jun 25, 2017, at 20:04, Edward Carroll notifications@github.com wrote:

To clarify, are you meaning for this to act like a sort of pagination for the results?

— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub, or mute the thread.

rwpino commented 6 years ago

@edcarroll any update about this new functionality? will be really useful

edcarroll commented 6 years ago

@rwpino nothing yet I'm afraid, I've been very busy and also haven't yet worked out how best to implement this with what is in there currently. Thinking perhaps an observable interface instead. Will update here when things progress 😄

genuinefafa commented 6 years ago

someone told me a few days ago obversables all the way, so yes, the obervables path seems like the way to go... maybe combine this with #207 ?

dev-fullstacktechnology commented 6 years ago

The best option of avoiding your issue is to reduce the number of a search result from the server response (using limit query). Generally searching feature use for quick lookup any detail. And if you have a large number of search result then my suggestion is to go to the separate page.

genuinefafa commented 6 years ago

@dev-fullstacktechnology I think it all depends on the use case for the app you are building, mine has many select searchable, that can result in many options, going to a different page is the "google way" but not in a big entry form...

Think of a user registration form with State/City as option, a searchable list will never go to a different page.

Also, select2, the old-mighty searchable input, has pagination and I beleive its API is very well done.

dev-fullstacktechnology commented 6 years ago

So you have multiple search options. I know one best example for your case. https://www.voucherify.io/

They have multiple search box where you have a drop down on campaign coupon, series, type and other tags. Among the search, it will display combined result below table in pagination view.

genuinefafa commented 6 years ago

I cannot see anything on that site without registering, think I would not like to do. Can you share a screenshot?

dev-fullstacktechnology commented 6 years ago

Actually, I used that site in my older project of one client, I don't have an account right now. But yeah, you need an account to check what you are looking. I found the image on google search, It is more like this, But in the new update, they made many changes. http://d33v4339jhl8k0.cloudfront.net/docs/assets/5902f1c12c7d3a057f88a36d/images/599d76ed2c7d3a73488c3c0e/file-UBxrAgd5QG.png

genuinefafa commented 6 years ago

I don't really follow you train of thought @dev-fullstacktechnology ... but the thing I'm looking is the same that select2 does, check this out, it has a selection input below the title when you can search github repos, also, when you reach the end it continue loading results.

Even better, they claim to have native support for laravel and other frameworks that paginate results. Is that what you were thinking too?