您的位置:首页 > Web前端 > JQuery

Jquery.Validate验证CheckBoxList,RadioButtonList,DropDownList是否选中

2014-11-12 14:39 435 查看
/article/2328154.html

<script type="text/javascript">

//DropDownList验证方法

$.validator.addMethod('selectNone',

function(value, element) {

return this.optional(element) ||(value!= -1);

}, "请选择至少一项!");

//ChekcBoxList验证方法

/*

$.validator.addMethod('atLeastOneChecked', function(value, element) {

var checkedCount = 0;

$("input[name^='" + <%=txtHistory.UniqueID %> + "']").each(function() {

if ($(this).attr('checked')) { checkedCount++; }

});

return checkedCount>0;

},"请选择至少一项");

*/

// 手机号码验证

$.validator.addMethod("isMobile", function(value, element) {

var length = value.length;

var mobile = /^(((13[0-9]{1})|(15[0-9]{1})|(18[0-9]{1}))+\d{8})$/;

return this.optional(element) || (length == 11 && mobile.test(value));

}, "请正确填写您的手机号码");

$(document).ready(function () {

//验证CheckBoxList

ValidateOptions = function(sender, args) {

args.IsValid=false;

var len = $("#history_DIV input:checked").length;

args.IsValid = (len>0);

};

$("#form1").validate(

{

rules: {

<%=txtVName.UniqueID %>: {

required: true

},

<%=txtEmail.UniqueID %>: {

required: true,

email:true

},

<%=txtRemark.UniqueID %>: {

required: true

},

<%=txtVSex.UniqueID %>: {

required: function(element) {

return $("input:radio[name='txtVSex']:checked").val()!="";

}

},

<%=txtFrom.UniqueID %>:{

selectNone: true

},

<%=txtMobile.UniqueID %>:{

required:true,

isMobile:true

},

<%=txtHistory.UniqueID %>:{

//required: function(element) {

//return ($("#history_DIV input:checked").length)>0;}

//return $("#<%=txtHistory.UniqueID %> input[@type=checkbox]:checked").size()>0;

// return $("input[name^='<%=txtHistory.UniqueID %>']").length>0

//atLeastOneChecked: true

}

},

messages: {

<%=txtRemark.UniqueID %>:

{

required: "请填写报名理由"

},

<%=txtVSex.UniqueID %>:

{

required: "请选择性别"

},

<%=txtMobile.UniqueID %>:{

required: "请填写手机号码"

},

<%=txtHistory.UniqueID %>:{

required: "请选择届数"

}

}

});

});

</script>

[html] view plaincopy

<table width="750" border="0" cellpadding="0" cellspacing="5">

<tr>

<td width="150" height="40">

真实姓名:

</td>

<td width="600">

<asp:TextBox ID="txtVName" runat="Server" Width="280px" />

</td>

</tr>

<tr>

<td height="40">

性别:

</td>

<td>

<asp:RadioButtonList ID="txtVSex" runat="server" RepeatDirection="Horizontal">

<asp:ListItem Text="男" Value="男"></asp:ListItem>

<asp:ListItem Text="女" Value="女"></asp:ListItem>

</asp:RadioButtonList>

<br />

</td>

</tr>

<tr>

<td height="40">

手机号码:<br />

</td>

<td>

<asp:TextBox ID="txtMobile" runat="Server" Width="280px" />

<span>请填写真实手机号码方便接收活动通知</span>

</td>

</tr>

<tr>

<td height="40">

E-Mail:<br />

</td>

<td>

<asp:TextBox ID="txtEmail" runat="Server" Width="280px" CssClass="email" />

<span>用于接收邮件通知</span>

</td>

</tr>

<tr>

<td height="40">

职业:<br />

</td>

<td>

<asp:RadioButtonList ID="txtC_Name" runat="server" RepeatDirection="Horizontal">

<asp:ListItem Text="学生" Value="1"></asp:ListItem>

<asp:ListItem Text="职员" Value="2"></asp:ListItem>

<asp:ListItem Text="经理" Value="3"></asp:ListItem>

<asp:ListItem Text="家庭主妇" Value="4"></asp:ListItem>

<asp:ListItem Text="自由职业者" Value="5"></asp:ListItem>

</asp:RadioButtonList>

</td>

</tr>

<tr>

<td height="40">

报名人数:<br />

</td>

<td>

<asp:RadioButtonList ID="txtC_EName" runat="server" RepeatDirection="Horizontal">

<asp:ListItem Text="就我一人" Value="1"></asp:ListItem>

<asp:ListItem Text="两人" Value="2"></asp:ListItem>

<asp:ListItem Text="三人" Value="3"></asp:ListItem>

</asp:RadioButtonList>

</td>

</tr>

<tr>

<td height="40">

报名理由:

</td>

<td>

<asp:TextBox TextMode="MultiLine" Columns="50" Rows="5" ID="txtRemark" runat="Server" />

<br />

<span>优质理由怎么写?1.描述您为什么要申请2.描述活动那里吸引您 3.个性化自由发挥</span>

</td>

</tr>

<tr>

<td height="40">

参加过的:<br />

</td>

<td>

<table>

<tr>

<td>

<div id="history_DIV">

<asp:CheckBoxList ID="txtHistory" runat="server" RepeatDirection="Horizontal">

<asp:ListItem Text="无" Value="0">

</asp:ListItem>

<asp:ListItem Text="第一届" Value="1">

</asp:ListItem>

<asp:ListItem Text="第二届" Value="2">

</asp:ListItem>

<asp:ListItem Text="第三届" Value="3">

</asp:ListItem>

</asp:CheckBoxList>

</div>

</td>

<td>

<asp:CustomValidator ID="customCheckBoxListValidator" runat="server" ErrorMessage="至少选择一项"

ClientValidationFunction="ValidateOptions" Display="Dynamic" ForeColor="Red"/>

</td>

</tr>

</table>

</td>

</tr>

<tr>

<td height="40">

了解活动:<br />

</td>

<td>

您从以下渠道得知本活动?

<asp:DropDownList ID="txtFrom" runat="server">

<asp:ListItem Text="请选择" Value="-1" Selected="True">

</asp:ListItem>

<asp:ListItem Text="搜索引擎" Value="1">

</asp:ListItem>

<asp:ListItem Text="朋友介绍" Value="2">

</asp:ListItem>

<asp:ListItem Text="平面媒介" Value="3">

</asp:ListItem>

<asp:ListItem Text="网站新闻" Value="4">

</asp:ListItem>

</asp:DropDownList>

</td>

</tr>

<tr>

<td height="60" colspan="2" align="center" valign="bottom">

<asp:Button ID="btnInsert" Text="确认报名" runat="server" />

</td>

</tr>

</table>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: