• 设为首页
  • 点击收藏
  • 手机版
    手机扫一扫访问
    迪恩网络手机版
  • 关注官方公众号
    微信扫一扫关注
    公众号

使用ASP.NET Atlas开发实时验证用户名是否被注册的自定义Behavior ...

原作者: [db:作者] 来自: [db:来源] 收藏 邀请
作者:Dflying Chen http://dflying.cnblogs.com/

昨天看到园内adonio朋友的使用CustomValidator类及时验证用户名,这是一个很常见的功能需求,且采用AJAX的方式可以带给用户更好的体验。adonio朋友使用的是未经包装的AJAX方法,其实我们完全可以基于现有的Atlas框架,开发出更易使用的组件。

这里我将上述功能封装为Atlas中的Behavior,以方便重用。关于AtlasBehavior,请参考:ASP.NET Atlas中创建自定义的Behavior

该检验用户名是否被注册的ValidateUserNameBehavior有如下几个属性:

  1. serviceName:获取或设定检查用户名的Web Service的路径名称。您必须指定这个属性。
  2. methodName:获取或设定检查用户名的Web Method名称。您必须指定这个属性。
  3. checkResultLabelID:获取或设定显示检查结果的DOM元素的ID。您必须指定这个属性。
  4. validMessage:获取或设置通过检查(用户名可用)时显示的文字。
  5. invalidMessage:获取或设置未通过检查(用户名不可用)时显示的文字。

同时,服务器端检查用户名的Web Method必须有如下的签名,其中传入一个待检查的用户名,返回检查后的布尔结果(可用/不可用):

public bool CheckUserName(string userNameCandidate)

关于这个ValidateUserNameBehavior的实现,您可以下载源代码后结合ASP.NET Atlas中创建自定义的Behavior中提到的五个步骤分析,其实是非常简单的。其中需要注意的是如下部分:

}

在该TextBox失去输入焦点时候blurHandler()将被调用,并且使用AJAX方式发送检查用户名的请求到指定的Web Service。在回调函数onMethodComplete()中,根据返回值设置相应的显示结果。

作为开发者,使用这个ValidateUserNameBehavior非常简单,请看如下的实例:

首先创建一个Web Service以及检查用户名的方法,这里为了演示,实现的逻辑很简单,只有DflyingAdmin两个用户,您可以根据实际情况更改:

using System;
using System.Web;
using System.Web.Services;
using System.Web.Services.Protocols;

[WebService(Namespace 
= "http://www.dflying.net/")]
[WebServiceBinding(ConformsTo 
= WsiProfiles.BasicProfile1_1)]
public class UserRegisterService : System.Web.Services.WebService
}

然后再用户注册的页面上添加ScriptManager,并且引用这个ValidateUserNameBehavior.js文件:

<atlas:ScriptManager runat="server" ID="ScriptManager1">
    
<Scripts>
        
<atlas:ScriptReference Path="ValidateUserNameBehavior.js" />
    
</Scripts>
</atlas:ScriptManager>

然后是提供用户输入用户名的input,以及相应的显示检验结果的span

<div>
    UserName:
    
<input type="text" id="userName" class="input" />
    
<span id="userNameError" ></span>
</div>

最后是AtlasXML Script,将上面的input提升为Atlas TextBox控件,在它的Behavior中添加我们的ValidateUserNameBehavior,并指定该Behavior的属性:

<script type="text/xml-script">
    
<page xmlns:script="http://schemas.microsoft.com/xml-script/2005">
        
<components>
            
<textBox id="userName">
                
<behaviors>
                    
<validateUserNameBehavior checkResultLabelID="userNameError" serviceName="UserRegisterService.asmx"
                        methodName
="CheckUserName" />
                
</behaviors>
            
</textBox>
        
</components>
    
</page>
</script>

浏览器中测试一下,输入一个可用的用户名:

输入Dflying,哦已经被注册了:

该示例程序以及相应的ValidateUserNameBehavior的源代码可以在此下载:https://files.cnblogs.com/dflying/ValidateUserNameBehavior.zip


鲜花

握手

雷人

路过

鸡蛋
该文章已有0人参与评论

请发表评论

全部评论

专题导读
热门推荐
热门话题
阅读排行榜

扫描微信二维码

查看手机版网站

随时了解更新最新资讯

139-2527-9053

在线客服(服务时间 9:00~18:00)

在线QQ客服
地址:深圳市南山区西丽大学城创智工业园
电邮:jeky_zhao#qq.com
移动电话:139-2527-9053

Powered by 互联科技 X3.4© 2001-2213 极客世界.|Sitemap