I render a partial after an ajax call:
show.js.erb
$("#notice_feed").html("<%=j render 'shared/notice_feed' %>")
_notice_feed.html.erb
<ol class="notices" id="notice_list">
<%= render @notices %>
</ol>
This ends up rendering a list of @notices
. The names of each notice
are
listed on the right and I have some jquery to scroll down to the
relevant
rendered @notice
when you click on the name:
name.on('click', function() {
$("#absolute-div").animate({scrollTop: $('#notice_' +
this.className).
offset().top -200 }, 500);
});
When you click on the name it correctly scrolls down, but only sometimes
stops scrolling on the correct @notice
, and gets nowhere near for
other
@notices
. I suspect the problem is that the jquery is called before
the
whole partial list has finished rendering. I’ve tried surrounding the
javascript with
$(window).on("load", function() {
...
};
but this doesn’t fire, presumably because it already fired when the
original page was loaded.
How do I check that a partial following an ajax call has fully loaded
using
jquery?
Or is there a better way to identify a div and scroll to it accurately?