使用javascript隐藏显示asp.net Validator控件

<script language="javascript" type="text/javascript"> 
function ValidatePage() 
{         
    //点击提交按钮触发的表单验证事件
    if (Page_ClientValidate())        
    { 
        return true; 
    } 
    else 
    {        
        hideValidatorCallout(); 
        return false; 
    } 
} 
//隐藏AjaxControlToolkit ValidatorCalloutExtender控件的方法
function hideValidatorCallout() 
{ 
    //下面的代码隐藏显示（激活）的AjaxControlToolkit ValidatorCalloutExtender控件
AjaxControlToolkit.ValidatorCalloutBehavior._currentCallout.hide(); 
    setTimeout(showValidatorCallout, 3000);    
}
function showValidatorCallout() 
{ 
    //通过$find方法获取AjaxControlToolkit ValidatorCalloutExtender控件
    AjaxControlToolkit.ValidatorCalloutBehavior._currentCallout = $find('<% =statusValidator_ValidatorCalloutExtender.ClientID %>'); 
    //显示AjaxControlToolkit ValidatorCalloutExtender控件
AjaxControlToolkit.ValidatorCalloutBehavior._currentCallout.show(true);
} 
</script>

　　上面代码中使用了： AjaxControlToolkit.ValidatorCalloutBehavior._currentCallout

　　_currentCallout 属性指向ValidatorCalloutExtender (VCE) 控件的引用。当验证不通过，并且存在验证标注和某个验证控件相管理，_currentCallout存储的为这个VCE的引用对象。如果当前页面存在多个VCE控件，_currentCallout指向和第一个发生错误的验证控件相关联的VCE控件。要隐藏验证标准控件，可以调用此对象的方法hide，代码如下

AjaxControlToolkit.ValidatorCalloutBehavior._currentCallout.hide();
                             

　　任何时候 _currentCallout仅和一个 VCE关联，防治同时显示多个VCE控件，导致页面杂乱，既当多个验证发生错误，会在多个地方显示验证标注。为了防止页面杂乱，每次只显示一个VCE控件。

　　同样的，要显示验证标准控件，可以调用_currentCallout 对象的方法show

//通过$find得到AjaxControlToolkit ValidatorCalloutExtender控件
    AjaxControlToolkit.ValidatorCalloutBehavior._currentCallout = $find('<% =statusValidator_ValidatorCalloutExtender.ClientID %>'); 
    //显示AjaxControlToolkit ValidatorCalloutExtender控件
    AjaxControlToolkit.ValidatorCalloutBehavior._currentCallout.show(true);
                                    

　　但是如果直接那样使用上面的代码，将会抛出异常

Microsoft JScript runtime error: 'this._popupBehavior' is null or not an object

　　原因是还没有调用ValidatorEnable　或者 ValidatorValidate函数，因为这２个函数会设置一些需要的配置，如 _popupBehavior属性，使验证控件能正常运作。 VCE控件不能直接显示，因为它是一个扩展的控件，扩展于验证控件（validation control）。但验证控件没有通过时与之关联的VCE才会自动显示，所有想直接显示VCE控件，首先需要调用ValidatorEnable 或者 ValidatorValidate 方法。

　　上面的代码演示了如何显示和隐藏验证标注控件，其中$find没有提到，具体可以参考：asp.net客户端$get和$find方法区别（查看原e文点击这里，原ｅ文在blogspot.com，挨GFW奸过的，需要翻墙，参考这个：翻墙工具下载地址。）

与验证标注控件（Validator callout controls，下面简称VCE）相关的比较重要的方法和属性

方法

1. _getErrorMessage()：返回错误信息
2. get_closeImageUrl()：返回右上角的关闭VCE图片的url地址，默认为X标记。
3. get_isOpen()：返回一个布尔值指示VCE显示或者隐藏
4. get_warningIconImageUrl()：返回警告图标地址， 默认图片为三角形里面有一个感叹号。
5. get_width()：返回VCE宽度
6. hide()：隐藏VCE
7. set_closeImageUrl(imageUrl)：设置VCE关闭图片，替换默认的X标记
8. set_warningIconImageUrl(imageUrl)：设置警告图片地址替换默认的
9. set_width(int) ：设置VCE宽度
10. show()：显示VCE

属性

1. _closeImageUrl：设置/获取关闭VCE的图片地址
2. _warningIconImageUrl：设置/获取警告图片地址
3. _width：设置/获取VCE宽度
4. _popupBehavior： VCE行为属性，详细参考下面
5. _errorMessageCell：设置/获VCE的错误信息，详细参考下面

ValidatorCallout._popupBehavior方法

　　与_popupBehavior属性相关方法（仅能通过这个属性调用），示例代码如下

//通过$find获取VCE控件
var valCallout = $find('<%=statusValidator_ValidatorCalloutExtender.ClientID %>'); 
//获取_popupBehavior属性后调用方法
var popUpBehavior = valCallout._popupBehavior; 
popUpBehavior.set_x(10); 
popUpBehavior.set_y(20); 
//或者直接通过VCE的_popupBehavior属性来调用
valCallout._popupBehavior.set_x(20); 
valCallout._popupBehavior.set_y(30);
                              

1. get_x()：返回VCE的x坐标（css对应的left属性）
2. get_y()：返回VCE的y坐标（css对应的top属性）
3. get_visible()：只是VCE是否可见
4. set_x(x_coordinate)：设置VCE的x坐标，参数为数字
5. set_y(y_coordinate)：设置VCE的y坐标，参数为数字

ValidatorCallout._errorMessageCell property属性

　　_errorMessageCell 属性为一个TD (cell)控件，相关的属性和方法与DOM对象的TD一致。下面的示例代码使用此属性更改错误信息。

//通过$find获取VCE控件
var valCallout = $find('<%=statusValidator_ValidatorCalloutExtender.ClientID %>'); 
//获得td单元格
var messageCell = valCallout._errorMessageCell; 
//修改单元格显示的错误信息
messageCell.innerHTML = "Changed:)";