Uncaught TypeError: Cannot read property 'slideCount' of undefined jquery.cycle2.js:299 #240

Open
mikila85 opened this Issue Jul 10, 2013 · 14 comments

Comments

Projects
None yet

the function "prepareTx" on line 299:
"if ( opts.slideCount < 2 ) {"

allways generating same error:
"Uncaught TypeError: Cannot read property 'slideCount' of undefined jquery.cycle2.js:299"

adding:

if(!opts) return;

right before it fixes it for me be there might be a better fix thats just mine :)

Owner

malsup commented Jul 11, 2013

Do you have an example of this error? I'm not seeing it.

It happens for me alot ill try to reproduce in jsfiddle

I can confirm, but not reproduce. I'm using Cycle2 in a Backbone app with RequireJS. My slideshow startup process is kind of crazy, so it's probably me, but mikila85's fix worked all the same. Below is the code from my Backbone view where I initialize Cycle2.

/**
 * Reload the widget feed
 */
refresh: function(feed) {
  var that = this;        
  var widget = this.model;
  that.data.widget = widget.toJSON();
  widget.feed.fetch({
    success: function(feed, response, options) {
      that.data.feed = feed.toJSON();
      // got the feed, now for articles
      feed.articles.fetch({
        success: function(articles, response, options) {
          var renderArticles = _.after(articles.length, function(){
            that.data.articles = articles.toJSON();
            that.$el.html(that.template(that.data));
            that.applyStyle(widget.get('settings'));
          });
          articles.each(function(article, i){
            article.slideImage(function(imageUrl){
              renderArticles();                  
            });
          });
        }
      }); 
    } 
  });
},

/**
 * Apply style (list, slideshow, etc.)
 */
applyStyle: function(settings) {
  settings = settings ? settings : {};
  var style = (settings.style) ? settings.style : 'list';
  this.$el.removeClass('list slideshow').addClass(style);
  if (style == 'slideshow') {
    this.$el.find('ul.items').cycle({
      delay: (Math.floor(Math.random() * 15) + 1) * 1000,
      fx: 'scrollHorz',
      next: this.$el.find('.cycle-next'),
      pager: this.$el.find('.cycle-pager'),
      pauseOnHover: true,
      prev: this.$el.find('.cycle-prev'),
      slides: '> li',
      speed: 800,
      timeout: 15 * 1000
    });
  }
},

@malsup Here's an example where this "bug" can be reproduced (I edited a guy's code basis in a forum, and discovered this problem, so Googled it, and found this issue thread):
http://plnkr.co/edit/9KZzy0hNwcy1AV69AI1C?p=preview
The content is loaded dynamically with AJAX (when clicking any of the menu elements), and Cycle 2 has to be reinitialized after loading a content for the slideshows to work. (So after one of the menu elements has been clicked, the previous content gets replaced.) In some cases, after clicking on one of the menu elements, "Uncaught TypeError: Cannot read property 'slideCount' of undefined" error message is displayed on the Console tab - the TypeError is thrown in $.fn.cycle.API.prepareTx, line 311, in the condition if ( opts.slideCount < 2 ).

@ghost

ghost commented Sep 2, 2014

@malsup : Yes! this bug is getting triggered. I too working on some SPA - MVC Project. Is this occurring when views(V) come into picture. As traversing to another view and coming back, its throwing error.

@malsup and @mikila85 I was having the same problem in an angular app and this fixed it. Since I didn't see a PR already there, I put one in. Thanks. Good work!

Had this problem as well with a SPA. The fix from @davidstanley01 works.

Applied the patch, it sometimes works and sometimes doesn't? weird..

@van-nguyen This is not so weird, because the patch is not a good solution. For example what if opts is NOT undefined, but it doesn't contain the slideCount property? This is your case: it sometimes works, sometimes doesn't.

The real solution is checking to see if opts is empty OR opts object does not contain the slideCount property (with the in operator):

if( jQuery.isEmptyObject(opts) || !("slideCount" in opts) ){
    return; // a better error handling would be cooler...
}

OR

if( !opts || !("slideCount" in opts) ) {
    return; // a better error handling would be cooler...
}

howells commented Jan 17, 2015

+1 I had to implement the from @peterharaszin for a site that uses Pjax

pbowyer commented Jun 10, 2015

👍 to the fix from @peterharaszin. It'd be great to get this rolled into the next release.

👍

mpntod commented Apr 3, 2016

Got the same problem. And a similar fix worked - although the ones above look a bit more comprehensive...
if ( typeof opts === 'undefined' ) { return; }

christiang commented Feb 25, 2017 edited

Shoot... seems like this thread answers my question about this Cycle2 error, except that the real solution is found within a link that no longer works! I'm unable to open the Plunker thread ("Loading" message never changes)—could someone please post some add'l information here?

plunker-never-loads

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