使用CustomValidator自定义验证控件检查是否有对ListBox控件选择
程序员文章站
2024-03-05 18:06:13
在前网页前端处,我们放置listbox控件,在数据提交前,检查用户是否有对此控件进行选择? insus.net的方法是使用javascript与customvalidato...
在前网页前端处,我们放置listbox控件,在数据提交前,检查用户是否有对此控件进行选择? insus.net的方法是使用javascript与customvalidator自定义验证控件来检查。
可以看到最终结果:
你也想参此例子,可以参考下面数据与准备方法,写一个对象,它将用来产生十个天干。
heavenlystem.cs
using system;
using system.collections.generic;
using system.linq;
using system.web;
/// <summary>
/// summary description for heavenlystem
/// </summary>
public class heavenlystem
{
private int _id;
private string _name;
public int id
{
get { return _id; }
set { _id = value; }
}
public string name
{
get { return _name; }
set { _name = value; }
}
public heavenlystem()
{
//
// todo: add constructor logic here
//
}
public heavenlystem(int id, string name)
{
this.id = id;
this._name = name;
}
}
产生与用泛型来存储它们:
private list<heavenlystem> getheavenstem()
{
list<heavenlystem> lisths = new list<heavenlystem>();
heavenlystem hs = new heavenlystem();
hs.id = 1;
hs.name = "甲";
lisths.add(hs);
hs = new heavenlystem();
hs.id = 2;
hs.name = "乙";
lisths.add(hs);
hs = new heavenlystem();
hs.id = 3;
hs.name = "丙";
lisths.add(hs);
hs = new heavenlystem();
hs.id = 4;
hs.name = "丁";
lisths.add(hs);
hs = new heavenlystem();
hs.id = 5;
hs.name = "戊";
lisths.add(hs);
hs = new heavenlystem();
hs.id = 6;
hs.name = "己";
lisths.add(hs);
hs = new heavenlystem();
hs.id = 7;
hs.name = "庚";
lisths.add(hs);
hs = new heavenlystem();
hs.id = 8;
hs.name = "辛";
lisths.add(hs);
hs = new heavenlystem();
hs.id = 9;
hs.name = "壬";
lisths.add(hs);
hs = new heavenlystem();
hs.id = 10;
hs.name = "癸";
lisths.add(hs);
return lisths;
}
html标记:
<asp:listbox id="listboxheavenlystem" runat="server" width="60" height="160" selectionmode="multiple"></asp:listbox>
<asp:customvalidator id="customvalidator1" runat="server" display="none" errormessage="必须选择选项" clientvalidationfunction="validatelistbox"></asp:customvalidator>
<asp:validationsummary id="validationsummary1" runat="server" enableclientscript="true"
showmessagebox="true" showsummary="false" />
<asp:button id="button1" runat="server" text="submit" />
接下来,你需要在.aspx.cs为listbox控件绑定数据,数据源即是刚才产生的list<heavenlystem>:
using system.collections.generic;
using system.data;
using system.data.oledb;
using system.linq;
using system.web;
using system.web.ui;
using system.web.ui.webcontrols;
using insus.net;
public partial class _default : system.web.ui.page
{
protected void page_load(object sender, eventargs e)
{
if (!ispostback)
data_binding();
}
private void data_binding()
{
this.listboxheavenlystem.datasource = getheavenstem();
this.listboxheavenlystem.datatextfield = "name";
this.listboxheavenlystem.datavaluefield = "id";
this.listboxheavenlystem.databind();
}
}
最后是写javascript脚本:
function validatelistbox(sender, args) {
var lb = document.getelementbyid("<%=listboxheavenlystem.clientid%>")
var options = lb.options;
args.isvalid = false;
for (var i = 0; i < options.length; i++) {
if (options[i].selected == true) {
args.isvalid = true;
return;
}
}
}
可以看到最终结果:
你也想参此例子,可以参考下面数据与准备方法,写一个对象,它将用来产生十个天干。
heavenlystem.cs
复制代码 代码如下:
using system;
using system.collections.generic;
using system.linq;
using system.web;
/// <summary>
/// summary description for heavenlystem
/// </summary>
public class heavenlystem
{
private int _id;
private string _name;
public int id
{
get { return _id; }
set { _id = value; }
}
public string name
{
get { return _name; }
set { _name = value; }
}
public heavenlystem()
{
//
// todo: add constructor logic here
//
}
public heavenlystem(int id, string name)
{
this.id = id;
this._name = name;
}
}
产生与用泛型来存储它们:
复制代码 代码如下:
private list<heavenlystem> getheavenstem()
{
list<heavenlystem> lisths = new list<heavenlystem>();
heavenlystem hs = new heavenlystem();
hs.id = 1;
hs.name = "甲";
lisths.add(hs);
hs = new heavenlystem();
hs.id = 2;
hs.name = "乙";
lisths.add(hs);
hs = new heavenlystem();
hs.id = 3;
hs.name = "丙";
lisths.add(hs);
hs = new heavenlystem();
hs.id = 4;
hs.name = "丁";
lisths.add(hs);
hs = new heavenlystem();
hs.id = 5;
hs.name = "戊";
lisths.add(hs);
hs = new heavenlystem();
hs.id = 6;
hs.name = "己";
lisths.add(hs);
hs = new heavenlystem();
hs.id = 7;
hs.name = "庚";
lisths.add(hs);
hs = new heavenlystem();
hs.id = 8;
hs.name = "辛";
lisths.add(hs);
hs = new heavenlystem();
hs.id = 9;
hs.name = "壬";
lisths.add(hs);
hs = new heavenlystem();
hs.id = 10;
hs.name = "癸";
lisths.add(hs);
return lisths;
}
html标记:
复制代码 代码如下:
<asp:listbox id="listboxheavenlystem" runat="server" width="60" height="160" selectionmode="multiple"></asp:listbox>
<asp:customvalidator id="customvalidator1" runat="server" display="none" errormessage="必须选择选项" clientvalidationfunction="validatelistbox"></asp:customvalidator>
<asp:validationsummary id="validationsummary1" runat="server" enableclientscript="true"
showmessagebox="true" showsummary="false" />
<asp:button id="button1" runat="server" text="submit" />
接下来,你需要在.aspx.cs为listbox控件绑定数据,数据源即是刚才产生的list<heavenlystem>:
复制代码 代码如下:
using system.collections.generic;
using system.data;
using system.data.oledb;
using system.linq;
using system.web;
using system.web.ui;
using system.web.ui.webcontrols;
using insus.net;
public partial class _default : system.web.ui.page
{
protected void page_load(object sender, eventargs e)
{
if (!ispostback)
data_binding();
}
private void data_binding()
{
this.listboxheavenlystem.datasource = getheavenstem();
this.listboxheavenlystem.datatextfield = "name";
this.listboxheavenlystem.datavaluefield = "id";
this.listboxheavenlystem.databind();
}
}
最后是写javascript脚本:
复制代码 代码如下:
function validatelistbox(sender, args) {
var lb = document.getelementbyid("<%=listboxheavenlystem.clientid%>")
var options = lb.options;
args.isvalid = false;
for (var i = 0; i < options.length; i++) {
if (options[i].selected == true) {
args.isvalid = true;
return;
}
}
}