Hi,
This is either a bug or I’m just using the selector wrong on the AJAX loader. I am attempting to recreate the hide / show spinner on load more, same as the change log video.
I have tried making the css selector either the ID selector of the load more button or the wrapping div, but in either case, the spinner always shows up as the last element in the query loop of posts I’m showing.
I just want to have the spinner show where the button was when its hidden
Hi,
I suggest you consider the parent div ID of the pagination element for the ajax loader.
Hi @HOSEIN - Yep, I tried that. Didn’t work
Hi Eric,
Thanks so much for your report!
Unfortunately, I cannot reproduce the issue. Would you be so kind as to provide a live link?
Best regards,
timmse
Hi @timmse,
Here are two links. Both of which are targeting the div surrounding the load more button. As you can see, it’s still putting the spinner at the end of the grid
Hi @lynxm ,
Thanks for the link.
We are aware of the AJAX loader issue when using external CSS method.
The fix already merged in next release.
You could try to change the CSS method to inline for now and check if it’s working good.
However, the selector should be #brxe-jzeuyc instead of brxe-jzeuyc based on your screenshot.
Regards,
Jenn
Yes, @itchycode is right, I changed the css loading method to external and the ajax loader was hidden.
Hi Jenn,
Thanks for taking a look. When I had it inline and included the “#”, it hid the load more button but also did not show the animation, which is why I didn’t include it. When no #, it shows the animation, just in the wrong place
I have the settings on external at the moment per the other topic, but I’m seeing the same behavior.
Eric
@itchycode
As I mentioned separately, thank you for your help resolving this issue!
Solution:
Type the whole ID name in the query loop area (such as “#brxe-bmfsjm”), not just bmfsjm or #bmfsjm.
Issue:
In my work flow, I would copy with the ID copy button, the name of the ID. I used this copy button to ensure I didn’t make a typo when transposing the text from one element to another on the structure pane.
When I went to paste, I would paste just the unique string “bmfsjm”, not the full “#brxe-bmfsjm”
This makes sense that the spinner disappears when I placed the # in front of #bmfsjm" since Bricks had no idea when I was talking about. When it was just “bmfsjm” it just ignored the string, and placed the spinner at the end of the query loop div
Recommendation:
In a future Bricks build and similar to the CSS ID text field for anchor links, I’d suggest placing some helper text below Query Loop CSS selector text field to remind users what the proper syntax is.
