Ext.Net- DirectMethods的使用
DirectMethod 提供了一种可以从客户端 JavaScript 代码调用服务器端 .NET 方法的功能。用 [DirectMethod] 属性修饰服务器端的 public 或 public static 方法,会向客户端 JavaScript 代码公开服务器端方法。
注意:服务器端的方法必须是 public 或 public static。
DirectMethod 基础
下面代码演示 DirectMethod 一个简单的例子,更新<ext:Label> 控件
<script runat="server"> [DirectMethod] public void SetTimeStamp() { this.Label1.Text = DateTime.Now.ToLongTimeString(); this.Label1.Element.Highlight(); } </script> <ext:Button ID="Button1" runat="server" Text="Click Me" Icon="Lightning"> <Listeners> <Click Handler="Ext.net.DirectMethods.SetTimeStamp();" /> </Listeners> </ext:Button> <br /> <ext:Label ID="Label1" runat="server" Format="Server Time: {0}" Text='<%# DateTime.Now.ToLongTimeString() %>' />
说明
1,在 Button1 客户端事件里,调用服务器端方法 SetTimeStamp 来更新 Label1 控件,并高亮显示。
2,另外,在 Ext.Net,当第一次请求页面时(此时为回发),IsAjaxRequest 为 false,之后为 true,因为之后的请求是 Ajax 请求。
从DirectMethod 返回一个字符串
DirectMethod 会返回任何类型的对象。这个对象被序列化成 JSON。被系列化的这个对象作为 result 参数发送给在 DirectMethod 中配置的回调函数 success。
<script runat="server"> [DirectMethod] public string GetTimeStamp() { return DateTime.Now.ToLongTimeString(); } </script> <ext:Button runat="server" Text="Click Me" Icon="Lightning"> <Listeners> <Click Handler=" Ext.net.DirectMethods.GetTimeStamp({ success: function (result) { Ext.Msg.alert('Server Time', result); } });" /> </Listeners> </ext:Button>
说明
在 Button1 客户端事件中,Ext.net.DirectMethods.GetTimeStamp(…) 是在客户端调用服务器端的方法 GetTimeStamp,success 是 Ext.net.DirectMethods 配置的回调函数,也就是说,当服务器端方法成功返回时,客户端需要根据返回的值执行的操作。在本例中,如果服务器端方法 GetTimeStamp() 成功返回服务器端当前时间,则客户端弹出这个时间警告。
给DirectMethod 传递多个参数
如果服务器端 [DirectMethod] 方法要求参数,那么也要客户端 DirectMethod 传递两个参数给它。
本例中,如果服务器端要求两个参数:sting 和 int,那么在客户端也要传递两个可靠的参数给服务器端的 [DirectMethod] 方法。
<script runat="server">
[DirectMethod]
public void LogCompanyInfo(string name, int count)
{
string template = string.Concat("{0} has approximately {1} employees.");
string[] employees = new string[4] { "1-5", "6-25", "26-100", "100+" };
this.Label3.Text = string.Format(template, name, employees[count]);
}
</script>
<ext:Button runat="server" Text="Submit">
<Listeners>
<Click Handler="Ext.net.DirectMethods.LogCompanyInfo('Ext.NET, Inc.', 0);" />
</Listeners>
</ext:Button>
调用 DirectMethod 静态方法,并返回一个字符串(Super Fast + Best Performance)
当调用一个 public 服务端方法,默认情况下,在执行整个页面生命期时,这个方法可以访问页面上所有 Web 控件。
而带 static 的 [DirectMethod] 方法,不会执行页面生存期,并且不能访问页面 Web 控件。这减少了处理开销,优化了性能。
<script runat="server">
[DirectMethod]
public static string GetTimeStamp4()
{
return DateTime.Now.ToLongTimeString();
}
</script>
<ext:Button xrunat="server" Text="Click Me" Icon="Lightning">
<Listeners>
<Click Handler="
Ext.net.DirectMethods.GetTimeStamp4({
success: function (result) {
Ext.Msg.alert('Server Time', result);
}
});" />
</Listeners>
</ext:Button>
说明
Button1 客户端事件调用服务器端静态方法 GetTimeStamp(),获得服务器端当前时间。
注意:服务器端静态方法 GetTimeStamp() 中不能访问页面中的 Web 控件。
从静态 DirectMethod 返回一个自定义对象
DirectMethod 可以返回任何类型的对象。下面例子创建并返回一个 Customer 对象。
Customer 对象被序列化成 JSON,返回给客户端。在 DirectMethod 配置中,result 参数就是从服务器端返回的 Customer 对象。
<script runat="server">
// Define Customer Class
public class Customer
{
public int ID { get; set; }
public string FirstName { get; set; }
public string LastName { get; set; }
public string Company { get; set; }
public Country Country { get; set; }
public bool Premium { get; set; }
}
// Define Country Class
public class Country
{
public string Name { get; set; }
}
[DirectMethod]
public static Customer GetCustomer()
{
// Get your Customer data from somewhere...
return new Customer() {
ID = 99,
FirstName = "Peter",
LastName = "Smith",
Company = "CompanyX, LLC.",
Premium = true,
Country = new Country { Name = "Canada" }
};
}
</script>
<ext:Button runat="server" Text="Click Me" Icon="Lightning">
<Listeners>
<Click Handler="
Ext.net.DirectMethods.GetCustomer({
success : function (customer) {
var template = 'ID : {0}{6} Name : {1} {2}{6} Company : {3}{6} Country : {4}{6} Premium Member : {5}',
msg = String.format(template,
customer.ID,
customer.FirstName,
customer.LastName,
customer.Company,
customer.Country.Name,
customer.Premium,
'<br /><br />');
Ext.Msg.alert('Customer', msg);
}
});" />
</Listeners>
</ext:Button>
说明
1, 定义两个类 Customer 和 Country,Country 聚合在 Customer;
2, 服务器端静态方法 GetCustomer() 创建 Customer 对象返回给客户端。
注意:客户端如何访问对象 Customer。