TagCloud - Wcf Service

Event log

Demo Configurator

Load items with unit price greater than:5.00
The NaN option causes request failure.
Isolate this demo as a stand-alone application
  • About this demo
  • C#
  • VB

This example shows how to dynamically load RadTagCloudItems through a Wcf Service.

The path to the WcfService's svc file and the name of the service method are specified in the WebService-Path and WebService-Method properties of the RadTagCloud's WebServiceSettings tag.

<telerik:RadTagCloud ID="RadTagCloud1" runat="server" OnClientItemsRequesting="itemsRequesting" OnClientItemsRequested="itemsRequested" OnClientItemsRequestFailed="itemsRequestFailed">
    <WebServiceSettings Path="TagCloudWcfService.svc"Method="GetRadTagCloudItems" />

Use the RadTagCloud's requestItems client method to send items request with a specified argument to a Web Service. It is important to know that all current items will be removed, before the new ones are populated.

There are three client events where you can handle the items request:

  • OnClientItemsRequesting - fired before the request is sent to the Web Service. Here you can modify the parematers, which are sent to the Web Service or cancel the request.
  • OnClientItemsRequested - fired when the items are successfully loaded.
  • OnClientItemsRequestFailed - fired when the request for the itemsfails. The arguments provide information about the error message and allow the developer to cancel the error alert and process the error otherwise.

To use the WcfService support of RadTagCloud, the WcfService should have the following signature:

[ServiceContract(Namespace = "")]
[AspNetCompatibilityRequirements(RequirementsMode = AspNetCompatibilityRequirementsMode.Allowed)]
public class TagCloudWcfService
    public TagDataItem[] GetRadTagCloudItems(IDictionary<string, object> context)
        NorthwindReadOnlyEntities dataContext = new NorthwindReadOnlyEntities();
        decimal minUnitPrice = (context == null || context.Count == 0) ? 5 : decimal.Parse((string)context["minUnitPrice"]);
        var result = (from v in dataContext.Products
                      where v.UnitPrice > minUnitPrice
                      && v.CategoryID == 8
                      select new TagDataItem
                          Text = v.ProductName,
                          Weight = (double)v.UnitPrice
        return result.ToArray();
  • DefaultCS.aspx
  • TagCloudWcfService.cs
  • scripts.js
<%@ Page Language="C#"  %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns='http://www.w3.org/1999/xhtml'>
<head runat="server">
    <title>Telerik ASP.NET Example</title>
    <script src="scripts.js" type="text/javascript"></script>
    <form id="form1" runat="server">
    <telerik:RadScriptManager runat="server" ID="RadScriptManager1" />
    <telerik:RadSkinManager ID="RadSkinManager1" runat="server" ShowChooser="true" />
    <div class="demo-container size-narrow">
        <telerik:RadTagCloud RenderMode="Lightweight" ID="RadTagCloud1" runat="server" RenderItemWeight="true"
                             MinFontSize="10" MaxFontSize="32" OnClientItemsRequesting="itemsRequesting" OnClientItemsRequested="itemsRequested"
                             OnClientItemsRequestFailed="itemsRequestFailed" OnClientLoad="tagCloud_load">
            <WebServiceSettings Path="TagCloudWcfService.svc" Method="GetRadTagCloudItems"></WebServiceSettings>
    <qsf:EventLogConsole ID="EventLogConsole1" runat="server" AllowClear="true">
    <qsf:ConfiguratorPanel runat="server" ID="ConfigurationPanel1">
            <qsf:View runat="server">

                <qsf:DropDownList ID="MinWeightDD" Label="Load items with unit price greater than:" runat="server" AutoPostBack="false" OnClientSelectedIndexChanged="selectedIndexChanged">
                        <telerik:DropDownListItem Text="5.00" Value="5" />
                        <telerik:DropDownListItem Text="10.00" Value="10" />
                        <telerik:DropDownListItem Text="30.00" Value="30" />
                        <telerik:DropDownListItem Text="NaN" Value="n/a" />
                    <em>The NaN option causes request failure.</em>

Support & Learning Resources

Find Assistance

Help Us Improve

Was this example helpful?