Menu
VS2010, Silverlight 4.0.
Does anyone know if there is a way to have Visual Studio add javascript (or anything for that matter) to the html test page it generates when compiling a silverlight project for debug? Does it use a template, and if so, where is it?
260
Really interesting question!
I've tried to do something like that and finally found raw but pretty working solution:
First of all you should set specific page by using Properties -> Debug -> Specific Page. My page example:
<!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>
<title>SilverlightApplication1</title>
<script type="text/javascript">
</script>
</head>
<body>
<div id="fillWithData">
</div>
<form id="form1" runat="server" style="height:100%">
<div id="silverlightControlHost" style="height: 100%; text-align:center">
<object data="data:application/x-silverlight-2," type="application/x-silverlight-2" width="30%" height="30%">
<param name="source" value="file:///C:/Users/Igor/Documents/Visual Studio 2010/Projects/MobileTest/SilverlightApplication1/Bin/Debug/SilverlightApplication1.xap"/>
<param name="onError" value="onSilverlightError" />
<param name="background" value="white" />
<param name="minRuntimeVersion" value="4.0.50826.0" />
<param name="autoUpgrade" value="true" />
<a href="http://go.microsoft.com/fwlink/?LinkID=149156&v=4.0.50826.0" style="text-decoration:none">
<img src="http://go.microsoft.com/fwlink/?LinkId=161376" alt="Get Microsoft Silverlight" style="border-style:none"/>
</a>
</object><iframe id="_sl_historyFrame" style="visibility:hidden;height:0px;width:0px;border:0px"></iframe></div>
</form>
</body>
</html>
NOTE: blank script and div elements is important! we'll load dynamic js/html into them.
My silverlight xaml.cs:
public partial class MainPage : UserControl
{
public MainPage()
{
InitializeComponent();
Loaded += new RoutedEventHandler(MainPage_Loaded);
}
void MainPage_Loaded(object sender, RoutedEventArgs e)
{
HtmlDocument hostPage = HtmlPage.Document;
ScriptObject obj = hostPage.GetElementsByTagName("script")[0];
obj.SetProperty("innerHTML", "function alertonclick() { alert('Amazing! I am dynamic javascript!'); }");
HtmlElement ipAddressHtml = hostPage.GetElementById("fillWithData");
ipAddressHtml.SetProperty("innerHTML", @"<input id=""Button1"" type=""button"" value=""button"" onclick=""alertonclick();"" />");
}
}
VERY IMPORTANT NOTE: I've tested this code and it works only under Opera. If you need to test something using some other browser then you sould inline javascript directly into element.
Example:
public partial class MainPage : UserControl
{
public MainPage()
{
InitializeComponent();
Loaded += new RoutedEventHandler(MainPage_Loaded);
}
void MainPage_Loaded(object sender, RoutedEventArgs e)
{
HtmlDocument hostPage = HtmlPage.Document;
HtmlElement ipAddressHtml = hostPage.GetElementById("fillWithData");
ipAddressHtml.SetProperty("innerHTML", @"<input id=""Button1"" type=""button"" value=""button"" onclick=""alert('Amazing! I am dynamic javascript!');"" />");
}
}
This code works well under IE/FF/Chrome/Opera (of course :) ).
As for me I like first example with both dynamic js and html. And I'm pretty sure that it's possible to fix it and make acceptable by other browser not just Opera.
I hope that my examples will help you =)
129
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
