1

I have a series of yes/no questions that I am displaying one at a time using the Cycle plugin.

The questions are in a <ul> element.

When a question is answered, an AJAX request displays the proportions of people who answered yes or no to that question using a php script, and the question is removed from the <ul>.

This is where the problem is.

The author of the cycle plugin himself says that it is necessary to stop and restart the slideshow to remove a slide.

When I try to do this by calling $element.cycle('destroy') or $element.cycle('stop'), remove the element, then restarting with $element.cycle(), the cycle does not continue as expected. Only one transition happens, and then the slideshow stops.

Here is my JS:

$j = jQuery.noConflict(); 

$j(document).ready(function() {

  var $questions = $j('#questions');

  $questions.cycle();

  $j('#survey input').click(function(e) {
    e.preventDefault();
    question = parseInt($j(this).attr('name'));
    answer = $j(this).attr('value');

    $j.post( 'process.php', {
      question: question,
      answer: answer
    }, function(data) {
      $j('#result p').replaceWith('<p>' + data + '</p>');
    });

    $questions.cycle('destroy');
    $j(this).closest('.question').remove();
    $questions.cycle();

  });

});

And this is my HTML:

<ul id="questions">

    <li class="question">
      <h3>do you like to stay at home?</h3>
      <form id = "survey" action="process.php" method="post">
        <input type="submit" name = "2" value = "yes" >
        <input type="submit" name = "2" value = "no" >
      </form>
    </li>

  <!-- four or five more questions here -->

  </ul>
  <div id="result"><p></p></div>

What is going on here?

djb
  • 5,591
  • 5
  • 41
  • 47

1 Answers1

2

After much fiddling (pun intended) around with this, it appears the $.('destroy') function is not properly clearing its internal state which is causing the issue; the problem persists with or without removing any slides.

I've created a workaround here: http://jsfiddle.net/eF72L/2/

I hope this helps!

dSquared
  • 9,725
  • 5
  • 38
  • 54
  • Thanks... but I've tried this. Please see my original question. – djb Nov 14 '11 at 22:38
  • @djb Interesting as it works on the author's site. Are you using any specific transitions or options that aren't included in your OP? – dSquared Nov 14 '11 at 22:42
  • Hi @dSquared, no special options, just what you see above. – djb Nov 14 '11 at 22:46
  • @djb Take a look at the updated answer; hopefully the workaround is helpful. – dSquared Nov 14 '11 at 23:39
  • excellent! the scorched earth policy works... plus `live()`! thank you. – djb Nov 15 '11 at 00:35
  • one last q (sorry!) - could you point me towards any doc that explains why destroying the element itself performed the desired reset on cycle? – djb Nov 15 '11 at 00:44