|
前段时间,要做一个可输入的下拉框,在网上查了一些资料,自己做了一个。总体的思想是用一个文本框和下拉框做,将他们的位置用样式来控制,并用Render方法来控制输出。具体实现如下:
(1)新建一个Web控项
using System; using System.Collections; using System.ComponentModel; using System.Text; using System.Web; using System.Web.UI; using System.Web.UI.WebControls; using System.Web.UI.Design;
namespace MyWebControl { /// <summary> /// WebCustomControl1的摘要说明, 带输入框的下拉框 /// </summary> [DefaultProperty("Text"), ToolboxData("<{0}:WebCustomControl1 runat=server></{0}:WebCustomControl1>")] public class WebCustomControl1 : System.Web.UI.WebControls.WebControl, INamingContainer { private TextBox textBox; //用于输入的文本框 private DropDownList ddlListItem;//下拉框 private Hashtable values;//用于绑定下拉框框的值
public Hashtable Values { get { return values; } set { values = value; } } public WebCustomControl1() //初始化该控件 { textBox = new TextBox(); textBox.ID = "textBox";//用于当下拉框改变时用的! values = new Hashtable(); textBox.Style.Add("border", "0px"); ddlListItem = new DropDownList(); } protected override void Render(HtmlTextWriter writer) { int iWidth = Convert.ToInt32(base.Width.Value); //设置方本框和下拉框的大小 if(iWidth==0) { textBox.Width = Unit.Parse("75px"); ddlListItem.Width = Unit.Parse("100px"); } else { textBox.Width =Unit.Parse(iWidth+"px"); int ddlWidth=iWidth+25; ddlListItem.Width = Unit.Parse(ddlWidth + "px"); } writer.Write("<span style='position:relative'>"); //初始化下框! if (values.Count >0) { foreach (string key in values.Keys) { ListItem item = new ListItem(); item.Text = key; item.Value = key; ddlListItem.Items.Add(key); } } //当只有个选项时! if (values.Count == 1) { textBox.Text = ddlListItem.Items[0].Text; } //多处选项时,先将第一个选项选中,如果没有这个判断,当加载时选第一个时不能选中! if (values.Count > 1) { textBox.Text = ddlListItem.Items[0].Text; } //下拉框选项改变时激发的javascript事件,但也可以做成服务器事件! ddlListItem.Attributes.Add("onchange", "document.getElementById('textBox').value=this.value"); ddlListItem.RenderControl(writer); writer.Write("<span style='position:absolute;left:1px;width:100px;'>"); textBox.RenderControl(writer); base.Render(writer); writer.Write("</span></span>"); writer.Flush(); writer.Close(); } } }以上就是具体实现
|