Asp.net自定义控件之单选、多选控件
本文实例为大家分享了Asp.net单选、复选框控件的具体实现代码，供大家参考，具体内容如下
将常用的jquery插件封装成控件也是个不错的选择。
先看看效果：
1.新建类库项目，创建数据源类
[Serializable]
public class Select2Item
{
public bool Selected { get; set; }
public string Text { get; set; }
public string Value { get; set; }
public Select2Item() { }
public Select2Item(string text, string value)
{
this.Text = text;
this.Value = value;
}
public Select2Item(string text, string value, bool selected)
{
this.Text = text;
this.Value = value;
this.Selected = selected;
}
}
2.创建控件类CheckList，继承与WebControl，并定义 public List<Select2Item> Items数据项属性。
3.引入脚本文件及样式文件
a.创建脚本或样式文件，设置文件的属性-生成操作-嵌入的资源
b.需要在namespace上添加标记 [assembly: WebResource("命名空间.文件夹名.文件名", "mime类型")]
如：
[assembly: WebResource("Control.Style.checklist.css", "text/css",PerformSubstitution = true)]
[assembly: WebResource("Control.Scripts.checklist.js", "application/x-javascript")]
如果css文件里面存在图片的话，同样将图片设置为嵌入的资源，在css中的写法为<%=WebResource("命名空间.文件夹名.文件名")%>
PerformSubstitution 表示嵌入式资源的处理过程中是否分析其他Web 资源 URL，并用到该资源的完整路径替换。
c.重写protected override void OnPreRender(EventArgs e)，引入嵌入的脚本或样式文件
if(Page!=null) Page.Header.Controls.Add(LiteralControl),将<script><link>标签放到LiteralControl中，然后将LiteralControl添加到Page.Header中，最后在页面里你就会看到引入的<script><link>标签。
protected override void OnPreRender(EventArgs e)
{
if (this.Page != null)
{
StringBuilder sbb = new StringBuilder();
sbb.Append(string.Format(STYLE_TEMPLATE, Page.ClientScript.GetWebResourceUrl(this.GetType(), "HandControl.Style.checklist.css")));
sbb.Append(string.Format(SCRIPT_TEMPLATE, Page.ClientScript.GetWebResourceUrl(this.GetType(), "HandControl.Scripts.checklist.js")));
bool hascss = false;
LiteralControl lcc = new LiteralControl(sbb.ToString());
lcc.ID = "lccheck";
foreach (Control item in Page.Header.Controls)
{
if (item.ID == "lccheck")
hascss = true;
}
if (!hascss)
Page.Header.Controls.Add(lcc);
}
base.OnPreRender(e);
}
4.重写控件的protected override void Render(HtmlTextWriter writer)方法
这里主要是渲染控件的html，根据你的控件而定。
protected override void Render(HtmlTextWriter writer)
{
if (Items.Count > 0)
{
writer.Write("<div id='div" + this.ClientID + "' class='c01-tag-div' mul='" + (Multiple == true ? "1" : "0") + "'>");
if (Multiple == false)
writer.Write("<input name='tb" + this.ClientID + "' type='hidden' value='" + Items[0].Value + "' />");
else
writer.Write("<input name='tb" + this.ClientID + "' type='hidden' />");
bool first = true;
foreach (var item in Items)
{
if (Multiple == false)
{
if (item.Selected && first)
{
writer.Write("<a title='" + item.Text + "' class='c01-tag-item c01-tag-select' val='" + item.Value + "' tag='Y'>" + item.Text + "</a>");
first = false;
}
else
{
writer.Write("<a title='" + item.Text + "' class='c01-tag-item' val='" + item.Value + "' tag='N'>" + item.Text + "</a>");
}
}
else
{
if (item.Selected)
writer.Write("<a title='" + item.Text + "' class='c01-tag-item c01-tag-select' val='" + item.Value + "' tag='Y'>" + item.Text + "</a>");
else
writer.Write("<a title='" + item.Text + "' class='c01-tag-item' val='" + item.Value + "' tag='N'>" + item.Text + "</a>");
}
}
writer.Write("</div>");
}
}
5.添加GetSelected方法，返回List<Select2Item>，添加GetSelectValue，返回String（多选以,号隔开）
public List<Select2Item> GetSelected()
{
if (Page != null)
{
var values = Page.Request.Form["tb" + this.ClientID].Split(',');
var res = Items.Where(t => values.Contains(t.Value)).ToList();
foreach (var item in Items)
{
if (res.Contains(item))
{
item.Selected = true;
}
else
{
item.Selected = false;
}
}
return res;
}
else
{
return null;
}
}
public string GetSelectValue()
{
if (Page != null)
{
return Page.Request.Form["tb" + this.ClientID];
}
return "";
}
6.保存状态
你需要重写两个方法protected override object SaveViewState() 、protected override void LoadViewState(object savedState)，旨在将Items数据项属性保存到ViewState
protected override object SaveViewState()
{
var valuestr = Page.Request.Form["tb" + this.ClientID];
if (!string.IsNullOrEmpty(valuestr))
{
var values = valuestr.Split(',');
var temp = Items.Where(t => values.Contains(t.Value)).ToList();
foreach (var item in temp)
{
item.Selected = true;
}
}
return new object[] { base.SaveViewState(), Items };
}
protected override void LoadViewState(object savedState)
{
object[] vState = (object[])savedState;
if (vState[0] != null)
base.LoadViewState(vState[0]);
if (vState[1] != null)
Items = (List<Select2Item>)vState[1];
}
7.单选和复选的设置，在js中控制
添加属性
[Description("获取和设置多选"), DefaultValue(true), Browsable(true), Category("杂项")]
public bool Multiple { get; set; }
在OnPreRender代码中你会发现Multiple属性会影响div的mul属性值，从而判断是否多选（默认多选）
8.其它说明
private static readonly string STYLE_TEMPLATE = "<link href=\"{0}\" rel=\"stylesheet\" type=\"text/css\" />\r\n";
private static readonly string SCRIPT_TEMPLATE = "<script type=\"text/javascript\" src=\"{0}\"></script>\r\n";
效果图：
以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持脚本之家。
相关文章
这篇文章主要给大家介绍了关于.NET生成动态验证码的完整步骤，文中通过示例代码介绍的非常详细，对大家学习或者使用.NET具有一定的参考学习价值，需要的朋友们下面来一起学习学习吧2019-07-07
这篇文章主要介绍了详解ASP.NET Core Token认证,小编觉得挺不错的，现在分享给大家，也给大家做个参考。2016-12-12
这篇文章主要介绍了浅析.Net Core中Json配置的自动更新，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2019-04-04
这篇文章介绍了Entity Framework的导航属性，文中通过示例代码介绍的非常详细。对大家的学习或工作具有一定的参考借鉴价值，需要的朋友可以参考下2022-03-03
如何在ASP.NET Core中使用Session的示例代码
这篇文章主要介绍了如何在ASP.NET Core中使用Session的示例代码，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2021-01-01
通常在做主从表的数据录入中，会碰到在一个页面上同时录入主表数据和从表数据，主表的数据只有一条，从表的数据有一条到多条，这样就要动态创建从表数据录入入口。2010-03-03
asp.net下出现其中的组件“访问被拒绝”的解决方法...2007-04-04
最近项目中看到同事写的一个用户控件，是一个下拉，值是从XML中读取的，而且这部分还用到了LINQ读取XML的知识，最近才看了一点点LINQ的知识，当记录一下吧。2009-07-07
这篇文章主要介绍了viewstate和datatable动态录入数据示例,需要的朋友可以参考下2014-02-02
ASP.NET中操作数据库的基本步骤分享，学习asp.net的朋友可以参考下。2011-10-10
最新评论