Primeng: Add spinner / loading image into autocomplete component

[ghost]

Do you take in consideration the opportunity to add a spinner when user typing / searching something into auto complete component by asynchronous request?

[cagataycivici]

Will do for 4.1.1.

[orsolli]

What happened?

[miked1090]

@cagataycivici Any update on this? The Autocomplete component can really use some love.

[mtuzinskiy]

@cagataycivici Any updates? That feels like a crucial feature for an autocomplete component

[anilkhichar]

@cagataycivici
It's not there in 4.2.0 release as well. When we can expect this?

In our use case we have massive data that we load on demand, sometime on typing and we also have infinite scroll inside the dropdown so we need this feature desperately.

[Ketec]

@khichar-anil but it is, i'm using it. It was added in 4.2.0 RC1.:

ui-autocomplete-loader | Loader icon.

[smurugavel]

right now, we have a home grown Angular component that can use icons for loading or "record not found". After upgrading to primeng 4.3 from 4.1.1, I see a spinner which is a good option, but it doesn't work for us. Is there a way to disable primeng loading spinner from autocomplete?
or atleast allow to display a different icon for "record not found" status.

[Ketec]

Why not override the icon in css? The class is provided (my previous comment).
like/deep/ .ui-autocomplete-loader::before {content: "\\f110" !important;}'

[Darnoj]

Well, in version 4.3.0 I do not see the ui-autocomplete-loader in any file, how can this be possible ?

[Ketec]

https://github.com/primefaces/primeng/blob/4.3.0/src/app/components/autocomplete/autocomplete.css

[Darnoj]

@Ketec well... the search of ui-autocomplete-loader in my node_module/primeng was returning nothing but it is finally in primeng.css
Forget about that, I just missed the information at some point.

[Ketec]

I have 4.3.0 installed from npm and i can see it in primeng.css and autocomplete.js

[Darnoj]

@Ketec the fact is that the loader isn't displayed, may it be linked with ultima theme we are using ?

[Ketec]

@Darnoj Theme should not affect the npm core. Isn't the ultima theme as a separate resource?

[Darnoj]

@Ketec I tried to upgrade ultima theme to 4.3.0 but the spinner is still missing.
I have the following when loading : <i class="ui-autocomplete-loader fa fa-circle-o-notch fa-spin fa-fw"></i>
In chrome debug tool I can see that the css class applied are .material-icons and .fa but it seems that the fa-spin and fa-circle-o-notch are unresolved.

[Ketec]

You likely don't have font awesome included in the project.

[Darnoj]

@Ketec But Ultima overrides fa to material, see : https://forum.primefaces.org/viewtopic.php?f=45&t=47794
Maybe it is a bug of ultima ?

[Ketec]

Don't have ultima so cant say much about it - but if it's overriden, are all the specific classes for each element there too?
Perhaps it doesn't have fa-circle-o-notch in material and no custom class added for material override.

[Darnoj]

@Ketec exactly, the spinner should be also displayed on datatable
I searched in the Ultima support forum and found this :
https://forum.primefaces.org/viewtopic.php?f=45&t=50855

Thank you for your help !

[cagataycivici]

AutoComplete has a spinner since a couple of releases back.