服务器之家：专注于服务器技术及软件下载分享
分类导航

PHP教程|ASP.NET教程|Java教程|ASP教程|编程技术|正则表达式|C/C++|IOS|C#|Swift|Android|VB|R语言|JavaScript|易语言|vb.net|

服务器之家 - 编程语言 - ASP.NET教程 - Asp.net自定义控件之单选、多选控件

Asp.net自定义控件之单选、多选控件

2020-01-15 13:32波谷 ASP.NET教程

这篇文章主要为大家详细介绍了Asp.net自定义控件之单选、多选控件的相关资料，感兴趣的小伙伴们可以参考一下

本文实例为大家分享了Asp.net单选、复选框控件的具体实现代码，供大家参考，具体内容如下

将常用的jquery插件封装成控件也是个不错的选择。

先看看效果：

Asp.net自定义控件之单选、多选控件

1.新建类库项目，创建数据源类

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
[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.创建脚本或样式文件，设置文件的属性-生成操作-嵌入的资源

  Asp.net自定义控件之单选、多选控件

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>标签。

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
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，根据你的控件而定。 

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
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 csharp" id="highlighter_501053">
?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
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;
 }
}
?
1
2
3
4
5
6
7
8
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 

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
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";

效果图：

Asp.net自定义控件之单选、多选控件

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持服务器之家。

  • 多选
  • 单选
  • asp.net
  • 自定义控件

    • 延伸 · 阅读

    精彩推荐
    最近更新
    编辑推荐
    阅读排行
    热门标签
    hao123 　 转化 　 HttpClient 　 读取数据 　 oledb 　 ACE 　 本地计算机 　 Quartz 　 Swagger 　 Option 　 释放资源 　 换行 　 DataSet 　 AjaxControlToolKit 　 下拉菜单 　 DropDownList 　 asp.net 　 全角 　 半角 　 .NET 　 弹出框 　 依赖项 　 程序集 　 引用 　 对象 　 网页跳转 　 传值 　 页面 　 重复提交 　 随机密码 　
    © 2019-2024 服务器之家(www.zzvips.com) 版权所有关于我们联系我们版权申明网站地图