Hello everyone,
I just started using ASP.NET AJAX Q1 2009 and Silverlight Q1 2009 controls about a month ago, so if anyone can help me with this problem I would really appreciate it.
I embedded a Silverlight RadGauge control inside an ASP.NET page by following the steps in this video: http://tv.telerik.com/telerikwatchminute/episode/telerik-watch-minute-radgauge-for-sl-in-asp.net. Basically adding a Silverlight application to same solution as the ASP.NET web project, wrap the SL control in an ASP.NET user control and put the user control in the main page.
Everything is great, the control shows up on the page and I can pass values to it, until I put it in an RadAjaxPanel.
The gauge shows up on first load, but on postback it disappears entirely. Tracing the code shows that the SL control is not loaded at all (no Application_Startup or Loaded events fired). Switching to RadAjaxManager also doesn't work.
I tried replacing the RadAjaxPanel with the regular ASP.NET UpdatePanel, and it works this time. I thought RadAjaxPanel is a wrapper for the regular UpdatePanel and they should work the same. Am I missing something?
I need this to work for a report page I have, where it has some controls that updates a RadGrid and the Gauge, and everything is in a RadAjaxPanel. Since all the other pages uses the RadAjaxLoadingPanel and we would like the pages to behave consistently (e.g. using AjaxLoadingPanel, etc), it would be great if I don't have to switch to UpdatePanel for this page.
If RadAjaxPanel is not supposed to work with embedded SL controls, is there a way to pass values between a RadAjaxPanel and an UpdatePanel?
Below is my code:
the UserControl:
| <%@ Control Language="C#" AutoEventWireup="true" CodeBehind="ucSLGauge.ascx.cs" Inherits="TestSilverlight.UserControls.ucSLGauge" %> |
| <%@ Register Assembly="System.Web.Silverlight" Namespace="System.Web.UI.SilverlightControls" TagPrefix="asp" %> |
| <asp:Silverlight ID="SLGauge" runat="server" Source="~/ClientBin/SilverLightControls.xap" |
| OnPluginLoaded="pluginLoaded" MinimumVersion="2.0.31005.0" Width="280" Height="280"> |
| </asp:Silverlight> |
| <script type="text/javascript"> |
| var slCtrl = null; |
| var gaVal = null; |
| var width = null; |
| var height = null; |
| function pluginLoaded(sender) { |
| // Get reference to the sliverlight control on page. |
| slCtrl = sender.get_element(); |
| if (slCtrl != null) { |
| // Call scriptable method in Silverlight application (we call it here to ensure SL control is already loaded) |
| if (gaVal != null) { |
| slCtrl.content.slGaugeObject.SetNeedleValue(gaVal); |
| } |
| if ((width != null && width > 0) || (height != null && height > 0)) { |
| slCtrl.content.slGaugeObject.SetWidthHeight(width, height); |
| } |
| } |
| } |
| function setGaugeValue(val) { |
| if (val != null) { |
| gaVal = val; |
| } |
| } |
| function setGaugeValueAndSize(val, w, h) { |
| if (val != null) { |
| gaVal = val; |
| } |
| if (w != null && w > 0) { |
| wwidth = w; |
| } |
| if (h != null && h > 0) { |
| hheight = h; |
| } |
| } |
| function setWidthHeight(w, h) { |
| if (w != null) { |
| wwidth = w; |
| } |
| if (h != null) { |
| hheight = h; |
| } |
| } |
| </script> |
The ASPX page:
| <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="TestSilverlight._Default" ValidateRequest="false" %> |
| <%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %> |
| <%@ Register Assembly="System.Web.Silverlight" Namespace="System.Web.UI.SilverlightControls" TagPrefix="asp" %> |
| <%@ Register TagName="gauge" TagPrefix="ucSL" Src="~/UserControls/ucSLGauge.ascx" %> |
| <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> |
| <html xmlns="http://www.w3.org/1999/xhtml" > |
| <head runat="server"><title></title></head> |
| <body> |
| <form id="form1" runat="server"> |
| <telerik:RadScriptManager ID="RadScriptManager1" runat="server" /> |
| <telerik:RadAjaxLoadingPanel ID="radAjaxLoadingPanel1" runat="server" Skin="Vista"/> |
| <telerik:RadAjaxPanel ID="radAjaxPanel1" runat="server" LoadingPanelID="radAjaxLoadingPanel1" > |
| This control is inside RadAjaxPanel (will disappear on post back): <br /> |
| <ucSL:gauge runat="server" ID="myGauge" Width="280" Height="280" NeedleValue="20" /> |
| <asp:Button ID="btnRadPanelPostBack" runat="server" Text="Postback within RadAjaxPanel" /> |
| </telerik:RadAjaxPanel> |
| <br /><br /> |
| <asp:UpdatePanel ID="pnlTest" runat="server" UpdateMode="Conditional"> |
| <ContentTemplate> |
| This control is inside ASP:UpdatePanel (will retain on postback): <br /> |
| <ucSL:gauge runat="server" ID="Gauge1" Width="280" Height="280" NeedleValue="80" /> |
| <asp:Button ID="btnUpdPanelPostBack" runat="server" Text="Postback within UpdatePanel" /> |
| </ContentTemplate> |
| </asp:UpdatePanel> |
| </form> |
| </body> |
| </html> |
The Silverlight Xaml (pretty much the same as the demo):
| <UserControl x:Class="SilverLightControls.Page" |
| xmlns:telerik="clr-namespace:Telerik.Windows.Controls;assembly=Telerik.Windows.Controls" |
| xmlns:control="clr-namespace:Telerik.Windows.Controls;assembly=Telerik.Windows.Controls.Gauge" |
| xmlns:gauge="clr-namespace:Telerik.Windows.Controls.Gauges;assembly=Telerik.Windows.Controls.Gauge" |
| xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" |
| xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" > |
| <Grid x:Name="LayoutRoot"> |
| <Grid.Resources> |
| <ResourceDictionary> |
| <telerik:ResourceDictionary.MergedDictionaries> |
| <telerik:ResourceDictionary |
| Keys="RadialGaugeHalfCircleNStyle,RadialGaugeHalfCircleSStyle,RadialGaugeHalfCircleEStyle, |
| RadialGaugeHalfCircleWStyle,RadialGaugeQuarterCircleNEStyle,RadialScaleHalfCircleNStyle, |
| RadialScaleHalfCircleSStyle,RadialScaleHalfCircleEStyle,RadialScaleHalfCircleWStyle, |
| RadialGaugeQuarterCircleNEStyle,RadialGaugeQuarterCircleNWStyle, |
| RadialGaugeQuarterCircleSWStyle,RadialGaugeQuarterCircleSEStyle, |
| RadialScaleQuarterCircleNEStyle,RadialScaleQuarterCircleNWStyle, |
| RadialScaleQuarterCircleSWStyle,RadialScaleQuarterCircleSEStyle" |
| Source="/Telerik.Windows.Controls.Gauge;component/Themes/Generic.xaml" /> |
| </telerik:ResourceDictionary.MergedDictionaries> |
| </ResourceDictionary> |
| </Grid.Resources> |
| <control:RadGauge Width="280" Height="280" x:Name="radGauge1" > |
| <gauge:RadialGauge x:Name="radialGauge1"> |
| <gauge:RadialScale x:Name="radialScale" |
| Min="0" |
| Max="100" |
| MajorTicks="10" |
| MiddleTicks="2" |
| MinorTicks="10"> |
| <gauge:RadialScale.MajorTick> |
| <gauge:TickProperties Length=".12"/> |
| </gauge:RadialScale.MajorTick> |
| <gauge:RadialScale.MiddleTick> |
| <gauge:TickProperties Length="0.09" /> |
| </gauge:RadialScale.MiddleTick> |
| <gauge:RadialScale.MinorTick> |
| <gauge:TickProperties Length="0.05" /> |
| </gauge:RadialScale.MinorTick> |
| <gauge:RadialScale.Label> |
| <gauge:LabelProperties Location="Inside" /> |
| </gauge:RadialScale.Label> |
| <gauge:RadialScale.Indicators> |
| <gauge:Needle x:Name="needle1" IsAnimated="true" Value="70" ></gauge:Needle> |
| <gauge:RadialBar x:Name="radialBar1" IsAnimated="True" /> |
| </gauge:RadialScale.Indicators> |
| </gauge:RadialScale> |
| </gauge:RadialGauge> |
| </control:RadGauge> |
| </Grid> |
| </UserControl> |
<Results> <Result> <Url>Url 2</Url> <Title>Title 1</Title> <FileExtension>PPT</FileExtension> <Description>Desc 1</Description> <Size>36KB</Size> <Author>L1, F1</Author> <WriteDate>2010-04-29</WriteDate> <Rank>881</Rank> </Result> <Result> <Url>Url 1</Url> <Title>Title 2</Title> <FileExtension>PPT</FileExtension> <Description>Desc 2</Description> <Size>72KB</Size> <Author>L2, F2</Author> <WriteDate>2010-04-30</WriteDate> <Rank>825</Rank> </Result> </Results><telerik:RadGrid ID="RadGrid1" Width="97%" AutoGenerateColumns="false" AllowPaging="True" PageSize="15" runat="server" AllowSorting="True" OnNeedDataSource="RadGrid1_NeedDataSource" GridLines="None"> <MasterTableView Width="100%" > <ItemTemplate> <div> <span> <asp:HyperLink runat="server" ID="lnkResultUrl" NavigateUrl='<%#DataBinder.Eval(Container.DataItem, "Url")%> ' Text='<%#DataBinder.Eval(Container.DataItem, "Title")%> ' /> <br /> </span> <div> <asp:Label runat="server" ID="lblResultSummay1" Text='<%#DataBinder.Eval(Container.DataItem, "Description")%> '></asp:Label> <br /> </div> <p> <span> <asp:HyperLink runat="server" ID="lnkResult" NavigateUrl='<%#DataBinder.Eval(Container.DataItem, "Url")%> ' Text='<%#DataBinder.Eval(Container.DataItem, "Url")%> ' /> </span> - <asp:Label runat="server" ID="Label1" Text='<%#DataBinder.Eval(Container.DataItem, "Size")%> '></asp:Label> - <asp:Label runat="server" ID="Label2" Text='<%#DataBinder.Eval(Container.DataItem, "Author")%> '></asp:Label> - <asp:Label runat="server" ID="Label3" Text='<%#DataBinder.Eval(Container.DataItem, "WriteDate")%> '></asp:Label> <br /> </p> </div> </ItemTemplate> </MasterTableView> <PagerStyle Mode="NextPrevAndNumeric" PagerTextFormat="Change page: {4} | Displaying page {0} of {1}, items {2} to {3} of {5}"/> <FilterMenu EnableTheming="True"> <CollapseAnimation Duration="200" Type="OutQuint" /> </FilterMenu> </telerik:RadGrid>XElement xe= XElement.Parse(@"<Results> <Result> <Url>Url 2</Url> <Title>Title 1</Title> <FileExtension>PPT</FileExtension> <Description>Desc 1</Description> <Size>36KB</Size> <Author>L1, F1</Author> <WriteDate>2010-04-29</WriteDate> <Rank>881</Rank> </Result> <Result> <Url>Url 1</Url> <Title>Title 2</Title> <FileExtension>PPT</FileExtension> <Description>Desc 2</Description> <Size>72KB</Size> <Author>L2, F2</Author> <WriteDate>2010-04-30</WriteDate> <Rank>825</Rank> </Result> </Results>"); var xTest = from xItem in xe.Elements("Result") select new { Url = xItem.Element("Url").Value, Title = xItem.Element("Title").Value, FileExtension = xItem.Element("FileExtension").Value, Description = xItem.Element("Description").Value, Size = xItem.Element("Size").Value, Author = xItem.Element("Author").Value, WriteDate = xItem.Element("WriteDate").Value, Rank = xItem.Element("Rank").Value }; RadGrid1.DataSource = xTest;Load on demand does not populate drop down list with list items when using IE8. It works properly in FF and it has worked in previous versions of IE. I’ve downloaded the latest builds with the same results.
Is there a fix for this?
<!---- RAD CARRIER COMBOBOX -----><telerik:RadComboBox ID="radCarrierID" runat="server" EmptyMessage='<%# GetResourceValue("Txt:PleaseSelect", "VFB")%>' ShowToggleImage="True" ShowMoreResultsBox="true" EnableLoadOnDemand="True" OnItemDataBound="radCarrier_ItemDataBound" DropDownWidth="423px" Width="260px" OnClientFocus="ClearCarrierOnFocus" OnClientBlur="OnCarrierBlur" OnClientSelectedIndexChanged="HandleEndChangingCarrier" Skin="Outlook" OnItemsRequested="radCarrierID_ItemsRequested" EnableVirtualScrolling="true"> <HeaderTemplate> <table style="text-align: left"> <tr> <td style="width: 225px;"> Carrier </td> <td style="width: 125px;"> City </td> <td style="width: 25px;"> St </td> </tr> </table> </HeaderTemplate> <ItemTemplate> <table style="text-align: left"> <tr> <td style="width: 225px;"> <%# DataBinder.Eval(Container.DataItem, "Name") %> </td> <td style="width: 125px;"> <%# DataBinder.Eval(Container.DataItem, "City") %> </td> <td style="width: 25px;"> <%# DataBinder.Eval(Container.DataItem, "St") %> </td> </tr> </table> </ItemTemplate> </telerik:RadComboBox>
protected void radCarrierID_ItemsRequested(object sender, RadComboBoxItemsRequestedEventArgs e)
{
try
{
// create in memory datatable
DataTable tblName = new DataTable();
tblName.Columns.Add("NameID");
tblName.Columns.Add("Name");
tblName.Columns.Add("City");
tblName.Columns.Add("St");
e.Message = "No Matches";
if (e.Text != "")
{
WhereClause wc = new WhereClause();
OrderBy orderBy = new OrderBy(false, true);
orderBy.Add(CarrierTable.Carrier_Lookup_Name, OrderByItem.OrderDir.Asc);
string strFilter = "Carrier_Lookup_Name like '" + e.Text.Replace("'", "''") + "%'";
SqlFilter objFilter = new SqlFilter(strFilter);
wc.AddFilter(objFilter, CompoundFilter.CompoundingOperators.And_Operator);
int intTotalCount = CarrierTable.GetRecordCount(wc);
int itemOffset = e.NumberOfItems;
int intPage = itemOffset / ItemsPerRequest;
int endOffset = Math.Min(itemOffset + ItemsPerRequest, intTotalCount);
e.EndOfItems = endOffset == intTotalCount;
if (itemOffset <= intTotalCount)
{
foreach (CarrierRecord itemValue in CarrierTable.GetRecords(wc, orderBy, intPage, ItemsPerRequest))
{
tblName.Rows.Add(new string[] { itemValue.Carrier_ID.ToString(), itemValue.Carrier_Lookup_Name.ToString(), itemValue.Carrier_CitySpecified ? itemValue.Carrier_City.ToString() : "", itemValue.Carrier_StateSpecified ? CarrierTable.Carrier_State.Format(itemValue.Carrier_State.ToString()) : "" });
}
}
e.Message = String.Format("Items <b>1</b>-<b>{0}</b> out of <b>{1}</b>", endOffset, intTotalCount);
}
// radShipperID.DataTextField = "Name;City;St";
radCarrierID.DataValueField = "NameID";
radCarrierID.DataSource = tblName;
radCarrierID.DataBind();
}
catch (Exception ex)
{ e.Message = "Error: " + ex.Message; }
}
Phil
<%@ Control Language="C#" AutoEventWireup="true" CodeFile="ContentMenu.ascx.cs" Inherits="CMSControls_ContentMenu" %><%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %><telerik:RadAjaxManagerProxy ID="RadAjaxManagerProxy" runat="server"> <AjaxSettings> <telerik:AjaxSetting AjaxControlID="RadContextMenuMenu"> <UpdatedControls> <telerik:AjaxUpdatedControl ControlID="RadContextMenuMenu" /> <telerik:AjaxUpdatedControl ControlID="RadWindowMaster" /> <telerik:AjaxUpdatedControl ControlID="LabelDebug" /> <telerik:AjaxUpdatedControl ControlID="divMenu" LoadingPanelID="radAjaxLoadingPanel" /> </UpdatedControls> </telerik:AjaxSetting> </AjaxSettings></telerik:RadAjaxManagerProxy><asp:PlaceHolder ID="PlaceHolderAdmin" runat="server" /><div id="divMenu"> <asp:Literal ID="LiteralEmptyMenu" runat="server" /> <asp:PlaceHolder ID="PlaceHolderRadMenuCMS" runat="server" /></div><asp:Label ID="LabelDebug" runat="server" Text="" /><telerik:RadCodeBlock ID="RadCodeBlock1" runat="server"> <script type="text/javascript"> <asp:Literal ID="LiteralOnClientClose" runat="server" /> </script></telerik:RadCodeBlock>protected void RadContextMenuMenu_ItemClick(object sender, Telerik.Web.UI.RadMenuEventArgs e){ if (IsAdmin) { LabelDebug.Text += "RadContextMenuCMS_ItemClick " + e.Item.Text + "<br>"; MasterPage myMaster = Page.Master; RadContextMenu RadContextMenuMenu = (RadContextMenu)Shuware.ShuwareCommon.Web.FindControlByID(PlaceHolderAdmin.Controls, "RadContextMenuMenu"); RadWindow RadWindowMaster = (RadWindow)myMaster.FindControl("RadWindowMaster"); //Create a new RadWindow object and assign it the ID of the RadWindow hidden on the page switch (e.Item.Text) { case "Edit": RadWindowMaster.NavigateUrl = "~/contentmenueditor.aspx?id=" + Server.UrlEncode(MenuID.ToString()); RadWindowMaster.OnClientClose = "OnClientclose" + "_" + this.ID; RadWindowMaster.AutoSize = false; RadWindowMaster.Visible = true; RadWindowMaster.Height = Unit.Pixel(555); RadWindowMaster.Width = Unit.Pixel(485); RadContextMenuMenu.Items[1].Visible = true; RadContextMenuMenu.Items[2].Visible = true; break; case "Save": RadContextMenuMenu.Items[1].Visible = false; RadContextMenuMenu.Items[2].Visible = false; RadWindowMaster.Visible = false; Response.Redirect(Shuware.ShuwareCommon.Web.GetCurrentURL()); //redirect back to the same page break; case "Cancel": RadContextMenuMenu.Items[1].Visible = false; RadContextMenuMenu.Items[2].Visible = false; RadWindowMaster.Visible = false; break; case "Admin": RadContextMenuMenu.Items[1].Visible = false; RadContextMenuMenu.Items[2].Visible = false; RadWindowMaster.OnClientClose = "OnClientclose" + "_" + this.ID; RadWindowMaster.NavigateUrl = "~/admin.aspx"; RadWindowMaster.Visible = true; //show the admin window break; default: RadContextMenuMenu.Items[1].Visible = false; RadContextMenuMenu.Items[2].Visible = false; RadWindowMaster.Visible = false; break; } }}
This sets the onclientclose function for the radwindow.
string strScript = "function OnClientclose" + "_" + this.ID + "(sender, eventArgs)\n{\n var arg = eventArgs.get_argument();\nif(arg) {\n__doPostBack('ctl00$" + RadContextMenuMenu.ClientID.Replace("_", "$") + "', arg);\n}\n}";
LiteralOnClientClose.Text += strScript;/*This becomes the below code at runtime:function OnClientclose_ContentMenu1(sender, eventArgs){ var arg = eventArgs.get_argument(); if(arg) { __doPostBack('ctl00$ctl00$ContentPlaceHolder1$ContentMenu1$RadContextMenuMenu', arg); }}*/ var multipage = $find('multipage');var page = new Telerik.Web.UI.RadPageView();var tab = new Telerik.Web.UI.RadTab();tab.set_text("New Tab"); multipage.get_pageViews().add(page);$find('tabstrip').get_tabs().add(tab);I have a problem with the RadComboBox that I was hoping someone would have a fix for. The problem is that if an item’s text contains more than one space between the words, the spaces are removed. For example, if the text of an item is “Select Frequency”, then it shows up as “Select Frequency”. For our application we need to preserve the amount of white space in the text.
I have read on another post where it says to use   instead of a space, but the values in the list are all from user entered values in the database. I have been able to replace the spaces in the ItemDataBound event of the RadComboBox like this:
protected void RadComboBox1_ItemDataBound(object sender, RadComboBoxItemEventArgs e)
{
e.Item.Text = Page.Server.HtmlDecode(((DataRowView)e.Item.DataItem)[ColumnName].ToString().Replace(" "," "));
}
But this seems a little overly complicated to fix a problem like this. Any Suggestions.
function openConfirmBox() { radconfirm('Did you save an Excel Spreadsheet?', confirmCallBackFn, 330, 100, null,'Confirm'); } function confirmCallBackFn(arg) { alert(arg); if (arg == true); { document.getElementById('<%= UpdateFailed.ClientID %>').click(); } GetRadWindow().Close(); }