SlideShow with Load on Demand

[Seth]

Howdy,

I seem to be stuck on something that is prolly simple. I am using the RadRotator and want to show a series of images in a specific order. For example: an image that says Step 1, followed by an image that says Step 2, followed by an image that says Step 3. If I am on Step 1's image and I hit the previous button, Step 3's image should appear. I currently override the control buttons and use my own Left and Right button. If I use XML and load all the images from XML everything works fine.

However, I now need to be able to add dozens of steps and I don't want the user to wait for all the images to download. So I want to switch to the Load on Demand pattern. I have a web service method that creates the RadRotatorItemData on the fly and is working but not in the way I want. I am using the itemIndex parameter to determine what the next image that needs to be built is. However, since I don't know which direction the user is going (Left or Right) I build the wrong image if the user goes Left.

What I don't see in the documentation is how to specify how many items get created on demand and what the scope of those new items should be (ie. Steps 1 - 5 or Steps 15 - 20), The demo is loading 5 items at a time, but I don't see how that is configured. Also, if I have loaded the first 5, and I need the 2nd 5 items, how do I tell the web service method what batch of 5 I need, since I can only pass in the itemIndex parameter. And if my current index is 0, and the user clicks on the Left button, I need to load the last five steps (which may be Steps 18 - 23).

In summation, I want this slideshow demo merged with the Load on Demand functionality.

Hope this makes sense...

Thanks,
Seth

[Slav]

Hello Seth,

There is a way to pass a custom parameter to the WebService method, in order to provide additional data when using the Load On Demand feature. Please refer to the following instructions:

• Attach a handler to the client event OnClientItemsRequesting and implement it as demonstrated below:

  <script type="text/javascript">
      function OnClientItemsRequesting(oRotator, args)
      {
          args.set_argument("value");
      }
  </script>

• Then you can get the value in the WebService as shown in the following code sample:
  

  [WebMethod]
  public RadRotatorItemData[] GetRotatorData(int itemIndex, string argument)
  {
    ...
  }

  Please note that the name of the argument should be kept the same, in order to ensure proper functionality.

The scope of the items in the online demo Load On Demand is determined by the current item index, which is automatically passed to the itemIndex attribute of the WebService method, and a private variable itemCount, which is set with value 5 (the number of loaded items per request). You can check the exact setup in the local version of the online demos that can be found in the installation folder of the RadControls for ASP.NET AJAX (the path for the specific demo is \Live Demos\Rotator\Examples\LoadOnDemand).

Since the RadRotator's items that are loaded via WebService are inserted after the already present ones, changing the direction of the rotation will most probably cause unexpected behavior. It is recommended that a RadRotator, utilizing the Load On Demand functionality, is being scrolled only in one direction, as demonstrated in the demo.

I hope the provided information helps.

Greetings,
Slav
the Telerik team

[Brent]

How do you set the itemCount variable?  The Load On Demand feature loads 5 items at a time.  I want to only load one item at a time. 

thanks

[Slav]

Hi Brent,

In the online demo Load On Demand the number of loaded items is determined by the variable itemCount. This variable is defined in the WebService just before the GetRotatorData method. Please change its value to 1 in order to achieve the desired behavior.

private DataTable data = null;

private int itemCount = 1;

 

[WebMethod]

public RadRotatorItemData[] GetRotatorData(int itemIndex)

{

  ...  

}

The file, containing the code snippet shown above, is located in the following folder of your RadControls  installation: \Live Demos\App_Code\ToolTipWebService.cs. 

Greetings,
Slav
the Telerik team