Skip to main content
Home Forums Silverlight Programming Programming with .NET - General how to use more than one silverlight control in one aspx page?
10 replies. Latest Post by brijesh.tm.in on July 6, 2009.
(0)
kent.zhou
Member
109 points
397 Posts
11-10-2008 2:19 PM |
When create a silverlight app, I can create silverlight usercontrol like page1, page2. Page1 and page2 are independent control.
After page1.xaml, page2,xaml. are confirmed. Then I want to use these silver light controls in aspx pages. For example, I want to put them into one page webform1.aspx and maybe mixed with some other asp.net traditional controls, like gridview, textbox. treeview, etc.
It looks like one silverlight project has only one entry point page(default page.xaml) to outside through app.xaml code behind.
With markup in testing aspx page, it looks like:
<body style="height:100%;margin:0;"> <form id="form1" runat="server" style="height:100%;"> <asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager> <div style="height:100%;"> <asp:Silverlight ID="Xaml1" runat="server" Source="~/ClientBin/SilverlightApplication1.xap" MinimumVersion="2.0.31005.0" Width="100%" Height="100%" /> </div> </form></body>
It only reference the whole file SilverlightApplication1.xap, no information allow to point a particulat silverlight control, such as page1.xaml or page2.xaml. only way it trhout app.xaml code behind to initialize page.xaml.
Is it possible to use silverlight control in aspx page same as traditional asp.net control like textbox, treeview and even I can put them inside UpdatePanel for ajax?
Sample code please.
prujohn
Contributor
3567 points
703 Posts
11-10-2008 2:30 PM |
Implement a single UserControl as a container (this can be a blank Canvas or Grid). Using the Loaded event of this container control, you can use code-behind logic to load in other UserControls, based on whatever criteria you desire, like so:
MyContainerControl_Loaded(object sender, EventArgs e) { MyContainerControl.LayoutRoot.Children.Add(MyPage1UserControl); }
To answer your second question, it is possible to integrate the Silverlight control with some Ajax controls. But if you read around the forums a bit, you'll find more information about this. Some folks have reported cross-browser issues with Silverlight/Ajax integration.
sladapter
All-Star
17441 points
3,172 Posts
11-10-2008 3:41 PM |
You can use InitParameter to indicate which UserControl you want to use as Root for your application. So you can have one Silverlight Application project, but on each different ASP.NET page, they load different UserControl as application start up page.
See this thread:
http://silverlight.net/forums/p/21674/76345.aspx#76345
11-10-2008 3:44 PM |
Yeah I guess it depends on how early or late you need to make your content decision.
11-10-2008 10:01 PM |
Thanks for information. I followed the instruction from the link but get nothing.
My senario is:
Create a silverlight app TestSilverlight with web app(default|). In the silverlight project, create 2 silverlight controls: Page.xaml and Page1.xaml.
Then change App.xaml code for Applocation_Startup as:
private void Application_Startup(object sender, StartupEventArgs e) { //this.RootVisual = new Page(); if (e.InitParams.ContainsKey("Control")) { this.RootVisual = this.GetType().Assembly.CreateInstance(e.InitParams["Control"]) as FrameworkElement; // Create your Control } }
In web app aspx page set markup as:
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="TestSilverlight.Web._Default" %><%@ Register Assembly="System.Web.Silverlight" Namespace="System.Web.UI.SilverlightControls" TagPrefix="asp" %><!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"> <asp:ScriptManager ID="ScriptManager1" runat="server"> </asp:ScriptManager> <div> <table> <tr> <td> <div style="height: 100%;"> <asp:Silverlight ID="Xaml1" InitParameters="Control=TestSilverlight.Page" runat="server" Source="~/ClientBin/TestSilverlight.xap" MinimumVersion="2.0.31005.0" Width="100%" Height="100%" /> </div> </td> <td> <div style="height: 100%;"> <asp:Silverlight ID="Xaml2" InitParameters="Control=TestSilverlight.Page2" runat="server" Source="~/ClientBin/TestSilverlight.xap" MinimumVersion="2.0.31005.0" Width="100%" Height="100%" /> </div> </td> </tr> </table> </div> </form></body></html>
I pass the compiling. but when run the aspx page, nothing come out from silverlight control.
How to fix this problem?
11-10-2008 10:53 PM |
Put break point at Application_Startup function to see what is going on. Check e.InitParams["Control"] to see what is the value of it? The value should be the FullName of your TestSilverlight.Page UserControl. Is this control at the same Assmebly as your App.xaml? Check what is this.RootVisual after CreateInstance call.
The code above is a generic way to specify the start up control. Another simple way (easy to understand, but you have add more cases if you add more pages) to do it is just specify the InitParameters="Control=Page" or InitParameters="Control=Page2" etc, then create the Page control in your Application_StartUp function using the following code:
private void Application_Startup(object sender, StartupEventArgs e) { //this.RootVisual = new Page(); if (e.InitParams.ContainsKey("Control")) {
if(e.InitParams["Control"] == "Page")
this.RootVisual = new Page();
if(e.InitParams["Control"] == "Page1")
this.RootVisual = new Page1(); } }
11-11-2008 4:07 PM |
Yes, I did set the break and check the value for key/value when debugging. It looks fine.
Very interesting is: If I use default testing aspx TestSilverlightTestPage.aspx, it works fine. But if I use default.aspx page or any new aspx page, nothing happens.
What's going on? any setting or configuration place need to change to slove this problem?
11-11-2008 4:11 PM |
What's in your default.aspx page? The TestSilverlightTestPage.aspx is generated by VS that contains correct Sivlerlight tag. Did you add Silverlight tag to your default.aspx page? Otherwise it does not even have any Silverlight control embed in it.
11-11-2008 7:56 PM |
Here is the default.aspx:
11-11-2008 9:00 PM |
Try to put a height setting to the TD that contains the Silverlight control:
<table> <tr> <td style="height: 100%;"> <div style="height: 100%;"> <asp:Silverlight ID="Xaml1" InitParameters="Control=TestSilverlight.Page" runat="server" Source="~/ClientBin/TestSilverlight.xap" MinimumVersion="2.0.31005.0" Width="100%" Height="100%" /> </div> </td> <td> <div style="height: 100%;"> <asp:Silverlight ID="Xaml2" InitParameters="Control=TestSilverlight.Page2" runat="server" Source="~/ClientBin/TestSilverlight.xap" MinimumVersion="2.0.31005.0" Width="100%" Height="100%" /> </div> </td> </tr> </table>
I think the your code is fine, just the TD is collapsed so you do not see the control inside of it.
brijesh....
2 points
1 Posts
07-06-2009 8:40 AM |
thanks!