Apologies for the double post. I also meant to mention that of course
this means when they come back to the home page, the carousel is no
longer sliding automatically. I want to have the carousel begin to
slide again when the user returns to the page as well - so there is
tear down and then set up.

On May 15, 12:57 pm, David Clifton <[email protected]> wrote:
> I'm using Bootstrap in conjunction with Backbone in a single page
> application. On my main page, I have a bootstrap carousel. When a user
> clicks a button, they are taken to 'another page' - this is done by
> removing many elements related to the first page from the DOM (including
> the carousel) and then injecting new elements (new views in backbone) into
> the page.
>
> My issues is that when a user switches to another page, a javascript error
> is thrown (in un-minified bootstrap.js it is $next[0] is undefined, from
> line 347). Looking at that line, we are here:
>
>       if (!$.support.transition && this.$element.hasClass('slide')) {
>         this.$element.trigger('slide')
>         $active.removeClass('active')
>         $next.addClass('active')
>         this.sliding = false
>         this.$element.trigger('slid')
>       } else {
>         $next.addClass(type)
>         $next[0].offsetWidth // force reflow  <-- the problem line
>         $active.addClass(direction)
>         $next.addClass(direction)
>         this.$element.trigger('slide')
>
> this is in the slide function. My guess is that this is happening because
> the javascript is running and doesn't know that the carousel has been
> completely removed from the page.
>
> My question is - how can I properly cleanup before removing the object from
> the page so that the code is not attempting to execute slide on something
> that doesn't exist?
>
> Many thanks for any assistance.

Reply via email to