更新服务器端数据
页面上的HTML按钮可以用来调用DoUpdate函数,该函数会把数据发回给UpdateCustomer Web Service。虽然我们可以使用jQuery的bind函数将事件处理器附加到按钮的点击事件中,但是我们只会设置按钮的单击属性,和标准JavaScript客户端代码一样,用来调用DoUpdate函数:
在DoUpdate函数中,代码生成了NorthwindCustomer对象的实例,并从页面要素对其属性进行设置。该函数的开始部分如下:
var cust = new NorthwindCustomer();
cust.CompanyName = $('#').text();
cust.ContactName = $('#').val();
为了再次调用UpdateCustomer Web Service方法,笔者使用ScriptManager函数——并发送该方法所需的Customer对象。和之前一样,如果方法运行完整,就发送函数名称来调用;如果出错就发送方法调用。其代码如下:
为了扩展该页面,使其支持插入和删除操作。可以要求其他按钮,客户端代码和Web Services。
验证数据
ASP.NET验证控件可自动生成客户端代码,而且客户端代码可以选择性地添加到CustomerValidator。最有效的方法是从DoUpdate事件处调用该代码,如果其中一个验证器失效,就跳过更新。好在ASP.NET页面为该页面添加了一个ValidatorValidate的函数,发送客户端验证器的时候,它可以调用控件的客户端代码。如果验证失败,会显示控件的ErrorMessage,且验证器的isvalid属性会被设置为False。
使用客户端验证代码的第一步是找到页面的验证控件。必须将每个验证器发送到ValidateValidator函数,然后检查器isvalid属性。如果有任何验证器失效,该函数必须进行标注以防止进程继续。
虽然jQuery拥有大量函数,以及大量插件,但笔者不清楚具体哪个函数可以做什么。幸好,如果jQuery具备一个你需要的函数,你就可以使用它的每个函数。每个函数都以你自己函数执行一次。在这些函数中,关键词将指示当前要素。
在客户端,Validator控件和Span要素一样呈现出来。下列代码中的选择器被放置在DoUpdate函数中,它首先用Validator结尾的ID属性找出所有Span要素。然后,该代码调用了ValidatorValidate方法用于每个验证器,并检查了isvalid属性,还设置了一个isValid标记。最后,如果验证器失效,代码会跳过更新:
$("span[id$='Validator']").each(function() {
ValidatorValidate(this);
if (!this.isvalid) { isValid = false }; });
if (isValid) {
..update code..
管理页面外观
虽然本文的重心放在典型的CRUD操作上,但是研发jQuery的目的主要是支持CSS控制。
在DoUpdate函数中,如果操作成功,UpdateCustomer Web Service会返回字符串"OK",反之则返回出错信息。当Web Service方法将信息发送到页面标签的时候,CustomerUpdated函数会被调用:
if (msg == "OK") {
$('#').text("Update successful");
}
else {
$('#').text(msg); }
}
不过,错误信息应该是被高亮度显示出来。该代码将CSS类属性设置为高亮度显示:
$('#').text(msg);
$('#').addClass("ErrorStyle");
}
本文结合了Ajax,Web Service,服务器端编程以及jQuery多种技术。目的是创建响应更快,运行更快速的商业应用,从而减少服务器的负荷,减少网络流量。
(凡署名“IT168”的稿件均为本站原创,请在转载时注明出处及作者。非上述媒体稿件均系转载,转载目的在于传递更多信息,并不代表本网赞同其观点和对其真实性负责。转载者自负版权等法律责任。)