限制CheckBoxList控件只能单选实现代码及演示动画_实用技巧

开发要求,原本对CheckBoxList控件是用来让用户多选的。但现在特殊要求,这个CheckBoxList控件限制只能单选。

哈哈,看看做出来的效果:

为了你也能实现出来,可以参考下面的方法,第一是准备好一个对象“地支”(Terrestrial Branch)
TerrestrialBranch.cs

复制代码 代码如下:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
/// <summary>
/// Summary description for TerrestrialBranch
/// </summary>
namespace Insus.NET
{
public class TerrestrialBranch
{
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 TerrestrialBranch()
{
//
// TODO: Add constructor logic here
//
}
public TerrestrialBranch(int id, string name)
{
this.ID = id;
this._Name = name;
}
}
}

用数据填充这个对象,并用泛型List<t>来存储这十二个对象:

复制代码 代码如下:

private List<TerrestrialBranch> GetData()
{
List<TerrestrialBranch> tbs = new List<TerrestrialBranch>();
tbs.Add(new TerrestrialBranch(1,"子"));
tbs.Add(new TerrestrialBranch(2, "丑"));
tbs.Add(new TerrestrialBranch(3, "寅"));
tbs.Add(new TerrestrialBranch(4, "卯"));
tbs.Add(new TerrestrialBranch(5, "辰"));
tbs.Add(new TerrestrialBranch(6, "巳"));
tbs.Add(new TerrestrialBranch(7, "午"));
tbs.Add(new TerrestrialBranch(8, "未"));
tbs.Add(new TerrestrialBranch(9, "申"));
tbs.Add(new TerrestrialBranch(10, "酉"));
tbs.Add(new TerrestrialBranch(11, "戌"));
tbs.Add(new TerrestrialBranch(12, "亥"));
return tbs;
}

在.aspx页面拉一个CheckBoxList控件,设置两个属性RepeatColumns="6" RepeatDirection="Horizontal"

复制代码 代码如下:

<asp:CheckBoxList ID="CheckBoxListTerrestrialBranch" runat="server" RepeatColumns="6" RepeatDirection="Horizontal"></asp:CheckBoxList>

把刚才准备好的List<TerrestrialBranch>绑定给这个CheckBoxList控件:

复制代码 代码如下:

using System;
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.CheckBoxListTerrestrialBranch.DataSource = GetData();
this.CheckBoxListTerrestrialBranch.DataTextField = "Name";
this.CheckBoxListTerrestrialBranch.DataValueField = "ID";
this.CheckBoxListTerrestrialBranch.DataBind();
}
}

OK,一切准备就绪,可以写Javascript脚本,放在<head>之内。

复制代码 代码如下:

window.onload = function () {
var cbl = document.getElementById('<%= CheckBoxListTerrestrialBranch.ClientID %>')
var inputs = cbl.getElementsByTagName("input");
for (var i = 0; i < inputs.length; i++) {
if (inputs[i].type == "checkbox") {
inputs[i].onclick = function () {
var cbs = inputs;
for (var i = 0; i < cbs.length; i++) {
if (cbs[i].type == "checkbox" && cbs[i] != this && this.checked) {
cbs[i].checked = false;
}
}
}
}
}
}

时间: 2024-11-10 11:08:32

限制CheckBoxList控件只能单选实现代码及演示动画_实用技巧的相关文章

ASP.Net PlaceHolder、Panel等控件未实现INamingContainer,导致FindControl无效_实用技巧

代码如下: 复制代码 代码如下: Panel spnButtons = new Panel(); Button btn = new Button(); btn.ID = "btn1"; spnButtons.Controls.Add(btn); // 输出True,表示没有找到控件 Response.Write(spnButtons.FindControl(btn.ID) == null); 而如果是下面的代码就可以了: 复制代码 代码如下: Panel spnButtons = ne

ASP.NET 页面中动态增加的控件、添加事件第1/2页_实用技巧

要求:页面上有一个Add按钮,每点击一次该按钮,页面上动态创建一个WebPartZone! 提醒:WebPartZone只能在OnInit或之前才能创建,否则报异常! 大家都知道,按钮的点击事件是在RaisePostbackEvent时触发的,这意味着点击事件在OnLoad阶段之后才执行,远远落后于 OnInit阶段,而且ViewState在OnLoad时才准备好,OnInit以及之前的阶段根本就不能使用ViewState!如果试图在按钮点击事件里面创建WebPartZone等控件,唯一的后果就

ASP.NET让FileUpload控件支持浏览自动上传功能的解决方法_实用技巧

ASP.NET的FileUpload控件默认是不支持服务端的onchange事件的,此时可以用一种变通的方法来实现这一功能. 这就需要借用客户端的onchange事件,调用__doPostBack方法来用LinkButton的OnClick事件模拟一个事件触发的过程,具体代码如下: 客户端: <asp:FileUpload ID="fuPhoto" onchange="javascript:__doPostBack('lbUploadPhoto','')" r

ASPX中的用户控件与ASP中的INCLUDE方法对比_实用技巧

    在ASP的年代里,为了避免经常性重复的劳动,对一些功能相似的区域或者代码,经常作成一个文件,然后通过连接(直接连接或者虚拟连接)的方法引入到ASP网页文件之中,对于一个很大的引用了很多ASP文件就相当于一个文件被分成了很多块,彼此文件之间的数据是可以自由共享的(除了函数之中的数据).    ASPX的用户控件就与INCLUDE有很大的不同了,它的最大特点就是在于他是以包装好的对象的形式呈现,通过我们的编程,可以将一个公用的事例抽象出来,将一些功能和方法总结出来,作成相应的函数和属性供外部

灵活掌握asp.net中gridview控件的多种使用方法(下)_实用技巧

继续上篇文章的学习<灵活掌握asp.net中gridview控件的多种使用方法(上)>,在此基础上巩固gridview控件的操作使用,更上一层楼. 11.GridView实现用"..."代替超长字符串:效果图:   解决方法:数据绑定后过滤每一行即可 for (int i = 0; i <= GridView1.Rows.Count - 1; i++) { DataRowView mydrv; string gIntro; if (GridView1.PageInde

灵活掌握asp.net中gridview控件的多种使用方法(上)_实用技巧

灵活使用asp.net中gridview控件的方法有很多种,本文内容很富,希望大家都能有所收获. 1.GridView无代码分页排序: 效果图: 小提示: 1.AllowSorting设为True,aspx代码中是AllowSorting="True": 2.默认1页10条,如果要修改每页条数,修改PageSize即可,在aspx代码中是PageSize="12". 3.默认的是单向排序的,右击GridView弹出"属性",选择AllowSort

asp.net html控件的File控件实现多文件上传实例分享_实用技巧

asp.net多文件上传使用html控件的File控件,在form中就需要加入[ enctype="multipart/form-data"]. up3.aspx文件代码 复制代码 代码如下: <%@ Page Language="C#" AutoEventWireup="true" CodeFile="up3.aspx.cs" Inherits="up3" %> <!DOCTYPE ht

利用委托把用户控件的值显示于网页案例应用_实用技巧

Asp.net开发要求,就是用户控件(UserControl)是集成一个功能,需要处理好的数据,然后存数据库中并显示于网页上,让用户能检测到处理的数据情况. 本演示中,Insus.NET只是作了一个简单的举例而已,并应用了委托来实现.为了让大家更能理解,可以先看看操作动画演示:在你新建一站点上,创建一个PageB.aspx网页以及UcB.ascx用户控件,在UcB.ascx上拉一个TextBox和CheckBox以及Button控件: 复制代码 代码如下: UcB.ascx <%@ Contro

asp.net获得数据控件事件索引并获取其中值总结_实用技巧

复制代码 代码如下: 1.RowCommad //获得索引 int index = ((GridViewRow)(((Button)(e.CommandSource)).Parent.Parent)).RowIndex; 2.RowEditing等 //获得索引 int index = e.NewEditIndex; //获取当前GridViewRow对象 GridViewRow editGridViewRow = autoGridView.Rows[girdviewEditIndex]; //