ASP.NET jQuery 实例17 通过使用jQuery validation插件校验ListBox

这里我们举例校验ListBox两个规则：
•校验必选项
•选择范围在0~4项
界面代码：


代码如下:

<form id="form1" runat="server">
<div align="center">
<fieldset style="width: 350px; height: 200px;">
<table border="0" cellpadding="3" cellspacing="3">
<tr>
<td>
请选择汽车类型：
</td>
</tr>
<tr>
<td>
<asp:ListBox ID="lstCar" runat="server" Rows="5" SelectionMode="Multiple">
<asp:ListItem Value="1" Text="奔驰汽车"></asp:ListItem>
<asp:ListItem Value="2" Text="宝马汽车"></asp:ListItem>
<asp:ListItem Value="3" Text="奥迪汽车"></asp:ListItem>
<asp:ListItem Value="4" Text="现代汽车"></asp:ListItem>
<asp:ListItem Value="5" Text="丰田汽车"></asp:ListItem>
</asp:ListBox>
</td>
</tr>
<tr>
<td>
<asp:Button ID="btnSubmit" runat="server" Text="提交" />
</td>
</tr>
</table>
</fieldset>
<div id="message" class="alertmsg">
</div>
</div>
</form>

脚本代码：


代码如下:

<head id="Head1" runat="server">
<title>Recipe17</title>
<script type="text/javascript" src="Scripts/jquery-1.4.1-vsdoc.js"></script>
<script type="text/javascript" src="Scripts/jquery.validate.js"></script>
<script type="text/javascript">
$(function () {
$("#form1").validate({
rules: {
lstCar: { required: true, rangelength: [0, 4] }
},
messages: {
lstCar: { required: "至少选择一种车！",
rangelength: "选择的范围为零到四种车！"
}
},
errorLabelContainer: $("#message")
});
});
</script>
<style type="text/css">
.alertmsg
{
color: #FF0000;
}
</style>
</head>

界面效果：

赞 (0)

相关推荐

  • C#保存listbox中数据到文本文件的方法

    本文实例讲述了C#保存listbox中数据到文本文件的方法.分享给大家供大家参考.具体实现方法如下: private void SaveLstToTxt(ListBox lst) { sfd.Filter = "(*.txt)|*.txt"; if (sfd.ShowDialog() == DialogResult.OK) { string sPath = sfd.FileName; FileStream fs = new FileStream(sPath, FileMode.Crea

  • asp.net listbox实现单选全选取消

    前台 复制代码 代码如下: <head runat="server"> <title>部门多选</title> <meta name="GENERATOR" content="Microsoft Visual Studio.NET 7.0"> <meta name="CODE_LANGUAGE" content="C#"> <meta nam

  • C#读取文本文件到listbox组件的方法

    本文实例讲述了C#读取文本文件到listbox组件的方法.分享给大家供大家参考.具体实现方法如下: private void AddTxtToLst(string path,ListBox lst) { StreamReader file = new StreamReader(path,Encoding.Default); string s = ""; while (s != null) { s = file.ReadLine(); if (!string.IsNullOrEmpty(

  • C#入门教程之ListBox控件使用方法

    C#入门教程之ListBox控件使用方法

    ListBox控件的使用: 1)控件属性 Items SelectedItems SelectioModes 2)数据绑定 DataSoure DisplayMember ValueMenber 3)实例 下面开始一一说明上面的ListBox控件的使用. 首先来说控件的属性, (1)Items:使用此属性获取列表控件项的属性.此属性可用于确定列表控件中的选定项.添加items时既可以设计时静态添加,也可以在代码中动态添加.如果不想显示设计时添加的items,可以在代码中添加this.listBo

  • ASP.NET中 ListBox列表框控件的使用方法

    ListBox 控件允许用户从预定义的列表中选择一个或多个项.它与 DropDownList 控件的不同之处在于,它不但可以一次显示多个项,而且(可选)还允许用户选择多个项. 一.属性 属性 值 作用 SelectionMode Single|Multiple 列表选择模式:单选|多选 Selected False|True 是否为选中状态 二.示例 ListBox.aspx 复制代码 代码如下: <%@ Page Language="C#" AutoEventWireup=&q

  • .net中实现listBox左右移动

    今天用到listbox左右移动在网上找了一个,网友分享出来的,感觉不错,这里推荐给大家 复制代码 代码如下: <div style="width:200px; float:left;">     <table>     <tr>         <td  width="50%">         <asp:ListBox ID="ListBox2" runat="server&quo

  • ListBox实现上移,下移,左移,右移的简单实例

    复制代码 代码如下: <html><head>    <title>Javascript版选择下拉菜单互移且排序</title>    <meta http-equiv="Content-Type" content="text/html; charset=gb2312"></head><body>    <p>选定一项或多项然后点击添加或移除(按住shift或ctrl可以

  • 对ListBox的添加移除操作实例分享

    前台代码: 复制代码 代码如下: <div> <asp:ListBox ID="ListBox1" runat="server" Height="123px" Width="113px" SelectionMode="Multiple"> <asp:ListItem>tom</asp:ListItem> <asp:ListItem>jion<

  • asp.net中ListBox 绑定多个选项为选中及删除实现方法

    asp.net中ListBox 绑定多个选项为选中及删除实现方法

    我们先来看listbox绑定多选项实现 复制代码 代码如下: <%@ Page Language="C#" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <script runat="server"

  • C#实现让ListBox适应最大Item宽度的方法

    本文实例讲述了C#实现让ListBox适应最大Item宽度的方法.分享给大家供大家参考.具体实现方法如下: private void button1_Click(object sender, EventArgs e) { for (int i = 1; i <= 16; i++) { listBox1.Items.Add("TTTTTTTTTTTTTTTTTTTTTTTTTTTTT" + i.ToString()); } } private void button2_Click(

  • 给ListBox添加双击事件示例代码

    复制代码 代码如下: <!--创建一个JS调用button的click事件--> <script type="text/javascript"> function JsListChangeItem() { document.getElementById("buttonShow").click(); } </script> <!--创建一个隐藏的button,创建双击事件---> <asp:Button ID=&q

  • ASP.NET中DropDownList和ListBox实现两级联动功能

    ASP.NET中DropDownList和ListBox实现两级联动功能

    DropDownList和ListBox实现两级联动功能,它们可以将从后台数据库中搜选的出来的信息加以绑定,这里要实现的功能是在DropDownList中选择"省",然后让ListBox自动将其省份下的"市"显示出来,这就是所谓的两级联动功能,这个功能我们在很多注册网页上看见,今天就为大家解开ASP.NET神秘的面纱. 一.设置前台界面,在Web窗体中添加DropDownList和ListBox两个控件. 界面图如下所示. 二.编写后台代码 在这,后台代码编写在其窗

随机推荐