CustomValidator to CheckBoxList

摘要:CustomValidator to CheckBoxList

這次竟然讓我遇到一種狀況是,RequiredFieldValidator及CustomValidator無法指定他的ControlToValidate到CheckBoxList

導致不少人使用CustomerValidator搭配特定的JavaScript,那個JavaScript必須指定Control.ClientID

這相當的不方便。

所以我到處從網路抄抄抄,終於找到一種方法。

就是自訂Control,繼承CheckBoxList,使他可以被指定ControlToValidator

並且在搭配自訂JavaScript,可以達到,可以指定ControlToValidator及無需使用Control.ClientID方式來做!

第一步:繼承並改寫成可Valid的CheckBoxList

 

namespace Samples.AspNet.CS.Controls
{
    [ValidationPropertyAttribute("ValidateableProperty")]
    public class ValidateableCheckBoxList : CheckBoxList
    {

        public string ValidateableProperty
        {
            get { return (this.Items.Cast<ListItem>().Where(i => i.Selected).Count() > 0) ? "something was selected" : ""; }
        }
    }
}

第二步:註冊控制項

<%@ Register TagPrefix="aspSample" Namespace="Samples.AspNet.CS.Controls"%>

第三步:頁面撰寫,並撰寫自訂JavaScript,以下是完整程式碼,

可是有一個缺點,竟然使用RequiredFieldValidator 並且ValidationSummary 的ShowMessageBox ="true"會無效。

所以才逼不得以使用CustomValidator 加JavaScript囉!

 

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="TestCustomerValidator.aspx.cs" Inherits="Sample_TestCustomerValidator" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<%@ Register TagPrefix="aspSample" Namespace="Samples.AspNet.CS.Controls"%>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>未命名頁面</title>
</head>
<body>
    <form id="form1" runat="server">
    <div>    
        <aspSample:ValidateableCheckBoxList ID="ValidateableCheckBoxList1" runat="server" > 
            <asp:ListItem >Test1</asp:ListItem>
            <asp:ListItem >Test2</asp:ListItem>
        </aspSample:ValidateableCheckBoxList>
        <asp:TextBox ID="TextBox1" runat="server" Text=""></asp:TextBox>
        <asp:Button ID="Button1" runat="server" Text="Button" ValidationGroup ="A" />        
        <asp:CustomValidator ID="CustomValidator1" runat="server" Display ="None" ValidationGroup ="A" ErrorMessage ="請勾選" ControlToValidate ="ValidateableCheckBoxList1" ClientValidationFunction ="CheckValid"></asp:CustomValidator>
        <asp:RequiredFieldValidator ID="RequiredFieldValidator1" Display ="None" runat="server" ValidationGroup ="A"  ControlToValidate="TextBox1" ErrorMessage="請填寫"></asp:RequiredFieldValidator>        
        <asp:ValidationSummary ID="ValidationSummary1" ValidationGroup="A"  ShowMessageBox ="true" ShowSummary="false" runat="server" />
    </div>
        <script language='javascript' type='text/javascript'>
            function CheckValid(source, args) {
                var chkListArea = document.getElementById(source.controltovalidate);
                var chkList = chkListArea.getElementsByTagName('input');
                for (var i = 0; i < chkList.length; i++) {
                    if (chkList[i].checked) {
                        args.IsValid = true;
                        return;
                    }
                }
                args.IsValid = false;
            }
        </script>
    </form>
</body>
</html>