This is a migrated thread and some comments may be shown as answers.

Client Web service binding

1 Answer 161 Views

Grid

This is a migrated thread and some comments may be shown as answers.

Joseph asked on 09 Dec 2010, 05:56 AM

I'm trying to get the example of Client side web service binding working (http://demos.telerik.com/aspnet-ajax/grid/examples/client/livedata/defaultcs.aspx) but I can't seem to figure it out. I've copied the code from the example site, and my grid shows up, but it never calls my web service. I've verified that my web service is working and generating data by calling it manually, and it works. What am I doing wrong?

It won't let me attach a zip of my project, so what should I check? Is there an entry in the web.config I have to add or something?

Here's my main aspx file:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

<telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">

//<![CDATA[

function pageLoad(sender, args) {

setInterval("MarsLogsWS.GetRecentLogMessages(updateGrid)", 1000);

}

function updateGrid(result) {

var tableView = $find("<%= RadGrid1.ClientID %>").get_masterTableView();

tableView.set_dataSource(result);

tableView.dataBind();

}

function OnRowDataBound(sender, args) {

var spanControl = args.get_item().get_cell("Change").getElementsByTagName('span')[0];

var image = args.get_item().get_cell("Change").getElementsByTagName('img')[0];

if (args.get_dataItem().Change > 0) {

image.style.display = "";

image.src = "Images/up.gif";

spanControl.style.color = "green";

}

else if (args.get_dataItem().Change < 0) {

image.style.display = "";

image.src = "Images/down.gif";

spanControl.style.color = "red";

}

else {

image.style.display = "none";

spanControl.style.color = "";

}

//]]>

</script>

</telerik:RadCodeBlock>

</head>

<telerik:RadScriptManager ID="RadScriptManager" runat="server">

<asp:ServiceReference Path="MarsLogsWS.asmx" />

</Services>

</telerik:RadScriptManager>

RadGrid bound to live data:</h3>

<telerik:RadGrid ID="RadGrid1" AutoGenerateColumns="false" runat="server">

<telerik:GridTemplateColumn UniqueName="Type" HeaderText="Type" DataField="Type">

<asp:Label ID="Type" runat="server" Style="font-weight: bold;" />

</ItemTemplate>

</telerik:GridTemplateColumn>

<telerik:GridTemplateColumn UniqueName="Priority" DataField="Priority" HeaderText="Priority">

<asp:Label ID="Priority" runat="server" />

</ItemTemplate>

</telerik:GridTemplateColumn>

<telerik:GridTemplateColumn UniqueName="Text" DataField="Text" HeaderText="Text">

<asp:Label ID="Text" runat="server" />

</ItemTemplate>

</telerik:GridTemplateColumn>

<telerik:GridBoundColumn DataField="EventTime" UniqueName="EventTime" HeaderText="Event Time"

DataFormatString="{0:dd/MM/yyyy' 'HH':'mm':'ss}" />

</Columns>

</MasterTableView>

</ClientSettings>

</telerik:RadGrid>

</form>

</body>

</html>

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="ViewMarsLogs.aspx.cs" Inherits="Mars.Console.Web.ViewMarsLogs" %>

<%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

<telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">

//<![CDATA[

function pageLoad(sender, args) {

setInterval("MarsLogsWS.GetRecentLogMessages(updateGrid)", 1000);

}

function updateGrid(result) {

var tableView = $find("<%= RadGrid1.ClientID %>").get_masterTableView();

tableView.set_dataSource(result);

tableView.dataBind();

}

function OnRowDataBound(sender, args) {

var spanControl = args.get_item().get_cell("Change").getElementsByTagName('span')[0];

var image = args.get_item().get_cell("Change").getElementsByTagName('img')[0];

if (args.get_dataItem().Change > 0) {

image.style.display = "";

image.src = "Images/up.gif";

spanControl.style.color = "green";

}

else if (args.get_dataItem().Change < 0) {

image.style.display = "";

image.src = "Images/down.gif";

spanControl.style.color = "red";

}

else {

image.style.display = "none";

spanControl.style.color = "";

}

//]]>

</script>

</telerik:RadCodeBlock>

</head>

<telerik:RadScriptManager ID="RadScriptManager" runat="server">

<asp:ServiceReference Path="MarsLogsWS.asmx" />

</Services>

</telerik:RadScriptManager>

RadGrid bound to live data:</h3>

<telerik:RadGrid ID="RadGrid1" AutoGenerateColumns="false" runat="server">

<telerik:GridTemplateColumn UniqueName="Type" HeaderText="Type" DataField="Type">

<asp:Label ID="Type" runat="server" Style="font-weight: bold;" />

</ItemTemplate>

</telerik:GridTemplateColumn>

<telerik:GridTemplateColumn UniqueName="Priority" DataField="Priority" HeaderText="Priority">

<asp:Label ID="Priority" runat="server" />

</ItemTemplate>

</telerik:GridTemplateColumn>

<telerik:GridTemplateColumn UniqueName="Text" DataField="Text" HeaderText="Text">

<asp:Label ID="Text" runat="server" />

</ItemTemplate>

</telerik:GridTemplateColumn>

<telerik:GridBoundColumn DataField="EventTime" UniqueName="EventTime" HeaderText="Event Time"

DataFormatString="{0:dd/MM/yyyy' 'HH':'mm':'ss}" />

</Columns>

</MasterTableView>

</ClientSettings>

</telerik:RadGrid>

</form>

</body>

</html>

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="ViewMarsLogs.aspx.cs" Inherits="Mars.Console.Web.ViewMarsLogs" %>

<%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>

<!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 id="Head1" runat="server">

<telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">

<script type="text/javascript">

//<![CDATA[

function pageLoad(sender, args) {

setInterval("MarsLogsWS.GetRecentLogMessages(updateGrid)", 1000);

}

function updateGrid(result) {

var tableView = $find("<%= RadGrid1.ClientID %>").get_masterTableView();

tableView.set_dataSource(result);

tableView.dataBind();

}

function OnRowDataBound(sender, args) {

var spanControl = args.get_item().get_cell("Change").getElementsByTagName('span')[0];

var image = args.get_item().get_cell("Change").getElementsByTagName('img')[0];

if (args.get_dataItem().Change > 0) {

image.style.display = "";

image.src = "Images/up.gif";

spanControl.style.color = "green";

}

else if (args.get_dataItem().Change < 0) {

image.style.display = "";

image.src = "Images/down.gif";

spanControl.style.color = "red";

}

else {

image.style.display = "none";

spanControl.style.color = "";

}

//]]>

</script>

</telerik:RadCodeBlock>

</head>

<body class="BODY">

<form runat="server" id="mainForm" method="post">

<telerik:RadScriptManager ID="RadScriptManager" runat="server">

<Services>

<asp:ServiceReference Path="MarsLogsWS.asmx" />

</Services>

</telerik:RadScriptManager>

<h3 class="qsfSubtitle">

RadGrid bound to live data:</h3>

<telerik:RadGrid ID="RadGrid1" AutoGenerateColumns="false" runat="server">

<MasterTableView TableLayout="Fixed">

<Columns>

<telerik:GridTemplateColumn UniqueName="Type" HeaderText="Type" DataField="Type">

<ItemTemplate>

<asp:Label ID="Type" runat="server" Style="font-weight: bold;" />

</ItemTemplate>

<ItemStyle Width="150px" />

</telerik:GridTemplateColumn>

<telerik:GridTemplateColumn UniqueName="Priority" DataField="Priority" HeaderText="Priority">

<ItemTemplate>

<asp:Label ID="Priority" runat="server" />

</ItemTemplate>

</telerik:GridTemplateColumn>

<telerik:GridTemplateColumn UniqueName="Text" DataField="Text" HeaderText="Text">

<ItemTemplate>

<asp:Label ID="Text" runat="server" />

</ItemTemplate>

</telerik:GridTemplateColumn>

<telerik:GridBoundColumn DataField="EventTime" UniqueName="EventTime" HeaderText="Event Time"

DataFormatString="{0:dd/MM/yyyy' 'HH':'mm':'ss}" />

</Columns>

</MasterTableView>

<ClientSettings>

<ClientEvents OnCommand="function(){}" OnRowDataBound="OnRowDataBound" />

</ClientSettings>

</telerik:RadGrid>

</form>

</body>

</html>

And my web.config:

<?xml version="1.0"?>

<configuration>

<appSettings>

<add key="Telerik.ScriptManager.TelerikCdn" value="Disabled"/>

<add key="Telerik.StyleSheetManager.TelerikCdn" value="Disabled"/>

</appSettings>

<system.web>

<compilation debug="true" targetFramework="4.0"/>

<pages>

<controls>

<add tagPrefix="telerik" namespace="Telerik.Web.UI" assembly="Telerik.Web.UI"/>

</controls>

</pages>

<httpHandlers>

<add path="ChartImage.axd" type="Telerik.Web.UI.ChartHttpHandler" verb="*" validate="false"/>

<add path="Telerik.Web.UI.SpellCheckHandler.axd" type="Telerik.Web.UI.SpellCheckHandler" verb="*" validate="false"/>

<add path="Telerik.Web.UI.DialogHandler.aspx" type="Telerik.Web.UI.DialogHandler" verb="*" validate="false"/>

<add path="Telerik.RadUploadProgressHandler.ashx" type="Telerik.Web.UI.RadUploadProgressHandler" verb="*" validate="false"/>

<add path="Telerik.Web.UI.WebResource.axd" type="Telerik.Web.UI.WebResource" verb="*" validate="false"/>

</httpHandlers>

<httpModules>

<add name="RadUploadModule" type="Telerik.Web.UI.RadUploadHttpModule"/>

<add name="RadCompression" type="Telerik.Web.UI.RadCompression"/>

</httpModules>

</system.web>

<system.webServer>

<validation validateIntegratedModeConfiguration="false"/>

<modules runAllManagedModulesForAllRequests="true">

<remove name="RadUploadModule"/>

<add name="RadUploadModule" type="Telerik.Web.UI.RadUploadHttpModule" preCondition="integratedMode"/>

<remove name="RadCompression"/>

<add name="RadCompression" type="Telerik.Web.UI.RadCompression" preCondition="integratedMode"/>

</modules>

<handlers>

<remove name="ChartImage_axd"/>

<add name="ChartImage_axd" path="ChartImage.axd" type="Telerik.Web.UI.ChartHttpHandler" verb="*" preCondition="integratedMode"/>

<remove name="Telerik_Web_UI_SpellCheckHandler_axd"/>

<add name="Telerik_Web_UI_SpellCheckHandler_axd" path="Telerik.Web.UI.SpellCheckHandler.axd" type="Telerik.Web.UI.SpellCheckHandler" verb="*" preCondition="integratedMode"/>

<remove name="Telerik_Web_UI_DialogHandler_aspx"/>

<add name="Telerik_Web_UI_DialogHandler_aspx" path="Telerik.Web.UI.DialogHandler.aspx" type="Telerik.Web.UI.DialogHandler" verb="*" preCondition="integratedMode"/>

<remove name="Telerik_RadUploadProgressHandler_ashx"/>

<add name="Telerik_RadUploadProgressHandler_ashx" path="Telerik.RadUploadProgressHandler.ashx" type="Telerik.Web.UI.RadUploadProgressHandler" verb="*" preCondition="integratedMode"/>

<remove name="Telerik_Web_UI_WebResource_axd"/>

<add name="Telerik_Web_UI_WebResource_axd" path="Telerik.Web.UI.WebResource.axd" type="Telerik.Web.UI.WebResource" verb="*" preCondition="integratedMode"/>

</handlers>

</system.webServer>

<system.serviceModel>

<bindings />

<client />

</system.serviceModel>

</configuration>

1 Answer, 1 is accepted

answered on 14 Dec 2010, 10:17 AM

ClientBinding.zip

Hello Joseph,

I do not see reason why the code should not be working. For your convenience I am sending sample page demonstrating same scenario.

Best wishes,
Nikolay
the Telerik team

Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.