[jQuery] Re: How to load only one image at a time using JQuery Cycle Plugin?

[OutOfTouch]

Ok I am actually trying stuff now and can't get the onBefore to fire.
Here is what I decided to do:
When the selected value in a dropdown changes I make an ajax call and
get JSON data back.
And load all the images at once, no images are prexsting in the
markup.
Here is my JavaScript.

$('#nav2').hide();

$('#ddlAdFundSelection').change(function(){

       var selectedValue;
      var myDataToSend;

      selectedValue = $('#ddlAdFundSelection').val();
     myDataToSend = "{'adFundTypeId':'" +  selectedValue + "'}"

     $.ajax({
        type: "POST",
        url: "Default.aspx/GetMailPieceGroupsByAdFundTypeId",
        data: myDataToSend,
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: function(data, textStatus){var mailPieceGroups = eval('(' +
data + ')'); startSlideShow(data); }
     });

     function startSlideShow(data)
     {

         var html = '';
         var $slideshow2 = $('#slideshow2').cycle('stop').empty();
         mailPieceGroups = eval('(' + data + ')');
         length = mailPieceGroups.length;

        $('#nav2').show();

        $('#slideshow2').cycle({
        fx:     'fade',
        speed:  'fast',
        timeout: 0,
        next:   '#next2',
        prev:   '#prev2' ,
        before: onBefore
        });

         function onBefore(curr, next, opts)
         {

               // make sure we don't call addSlide before it is
defined
        if (!opts.addSlide || slidesAdded){return;}
                for (i = 0; i < length; i++)
        {
          html = '<a href="' + mailPieceGroups[i].OrderFormUrl + '"
id="orderFormUrl' + i +
                '"><img src="Images/'+ mailPieceGroups[i].FileName + '"
id="mailPieceImg' + i +
                '" width="200" height="200" /></a>';
        opts.addSlide(html);
        alert(html);
              }

            slidesAdded = true;
        };

    }; // End StartSlideShow