Asp.net页面中通过Js控制siliverLight显示值
时间：2010-08-17 来源：eric(宽田)
现在需要通过按钮来控制界面上的siliverlight显示的值。其方法如下。
1、首先在SiliverLight中UserControl中编写一个js可以访问的方法。注意：此方法要用ScriptableMember特性。
[ScriptableMember()]
public void GetTrendChart(string selectDate)
{
DateTime tempDate = new DateTime();
if (string.IsNullOrEmpty(selectDate) || !DateTime.TryParse(selectDate, out tempDate))
{
ShowInfo("日期有误");
return;
}
//取得资料,改变siliverLight显示值，此处省略CreateTrendChart()的代码。
CreateTrendChart(selectDate);
}
2、在App.xaml中注册此方法。
private void Application_Startup(object sender, StartupEventArgs e)
{
//调用UserControl
this.RootVisual = new Trend();
//注册js访问的方法
System.Windows.Browser.HtmlPage.RegisterScriptableObject("TrendMethod", this.RootVisual);
}
3.在Aspx页面的调用siliverlight中增加onload事件
<%--调用siliverlight--%><object data="data:application/x-silverlight-2," type="application/x-silverlight-2"
width="100%" height="100%">
<param name="source" value="../ClientBin/Iaddtech.Environmental.Web.Silverlight.xap" />
<param name="onError" value="onSilverlightError" />
<param name="background" value="white" />
<param name="minRuntimeVersion" value="3.0.40818.0" />
<%--增加Load事件--%>
<param name="onLoad" value="siliverLoaded" />
<param name="autoUpgrade" value="true" />
<param name="Windowless" value="true" />
<a href="http://go.microsoft.com/fwlink/?LinkID=149156&v=3.0.40818.0" style="text-decoration: none">
<img src="http://go.microsoft.com/fwlink/?LinkId=108181" alt="Get Microsoft Silverlight"
style="border-style: none" />
</a>
</object>
4、编写onload事件。通过onload事件得到siliverlight对象。
var siliverlightObj = null;
function siliverLoaded(sender, args) {
siliverlightObj = sender.getHost(); //get Siliverlight Object
}
</script>
5、在Aspx页面上增加一个input。通过此input改变siliverLight显示值。此input的onclick方法为GetTrendData.
<div class="Query_button"><input type="image" value="getDate" onclick="GetTrendData(); return false;" src="../Resources/images/see_button.jpg" />
</div>
6、在js中添加input的click事件。 通过Click事件调用Siliverlight中方法
//input的click事件
function GetTrendData() {
//siliverlightObj在上边的onload事件中已得到,selectDate为给siliverlight的参数
siliverlightObj.Content.TrendMethod.GetTrendChart(selectDate);
}
</script>
这样就可以通过js来控制siliverlight显示值了。
相关阅读 更多 +
