Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Scrollspy "refresh" doesn't work, undocumented "process" does #20022

Closed
natevw opened this issue Jun 2, 2016 · 8 comments
Closed

Scrollspy "refresh" doesn't work, undocumented "process" does #20022

natevw opened this issue Jun 2, 2016 · 8 comments

Comments

@natevw
Copy link

natevw commented Jun 2, 2016

I found #2795, but it doesn't seem to cover my case. After I load AJAX content, I call $('[data-spy="scroll"]').scrollspy('refresh'); as is supposed to "help" the scrollspy plugin catch up. However, the navbar its is supposed to be updating (which is in the loaded content, whereas the data-spy element is the body element) still doesn't get the correct button activated.

[And yes I've tried the bizarre $('[data-spy="scroll"]').each(function () { var unusedSilliness = $(this).scrollspy('refresh'); }) "recommendation" that's in the docs right now too, no difference…]

Workaround:

After reviewing the internal code, I found the "process" method that actually gets called in response to a mouse wheel. Calling that via $('[data-spy="scroll"]').scrollspy('process'); does the trick. I've wrapped it in a try block just in case; but why doesn't refresh work as claimed?

@cvrebert
Copy link
Collaborator

cvrebert commented Jun 2, 2016

Could you post an example that demonstrates the problem?

@cvrebert cvrebert added the js label Jun 2, 2016
@cvrebert
Copy link
Collaborator

cvrebert commented Jun 2, 2016

Also, I assume you're using Bootstrap v3.3.6 ?

@twbs-closer
Copy link

Hey there!

We're automatically closing this issue since the original poster (or another commenter) hasn't yet responded to the question or request made to them 14 days ago. We therefore assume that the user has lost interest or resolved the problem on their own. Closed issues that remain inactive for a long period may get automatically locked.

Don't worry though; if this is in error, let us know with a comment and we'll be happy to reopen the issue.

Thanks!

(Please note that this is an automated comment.)

@goodforenergy
Copy link

Hey there, I think I'm running into this too. I've created a pen to demonstrate the issue I'm having.

Steps to reproduce:

  1. Scroll a little to see the scrollspy in action
  2. Click the "Reload content" button to simulate refreshing content

At this point, refresh has been called on the scrollspy and the now centred section should be active in the menu, but it isn't.

Please let me know if you'd prefer I open a new ticket, or if I've missed something. Thanks!

@natevw
Copy link
Author

natevw commented Mar 2, 2017

@cvrebert @twbs-closer Can you re-open based on the sample code that @goodforenergy provided?

@Johann-S
Copy link
Member

Johann-S commented Mar 6, 2017

Support for v3 has mostly ceased (see : #20631). Please let us know if this issue affects v4.

@goodforenergy
Copy link

Thanks @Johann-S, will let you know.

@natevw
Copy link
Author

natevw commented Dec 3, 2019

While troubleshooting a related bug in this project, I ended up coming across my workaround code here. As it turns out, this may have been due to the following circumstances:

  1. The v3.3.7 code doesn't initialize the HTML data-api until $(window).on('load', …).
  2. My .scrollspy('refresh') code was running in an AJAX callback that in practice tends to happen before the window load event, as it turns out.

So it may be the case here that I was trying to refresh/process the element with the wrong options set, although it's been a while and the event ordering may have changed in the interim. Replacing my earlier workaround with:

$('[data-spy="scroll"]').each(function () {
  var $spy = $(this);
  $.fn.scrollspy.call($spy, $spy.data());
});

seems to work as well as refresh+process for just getting the nav buttons in the right state, and avoids setting up the scrollspy without the options it needs from the HTML.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

5 participants