可輸入下拉框(完美版),asp.net

來源:互聯網
上載者:User
 

最近很是鬱悶,一個可輸入的下拉框搞了我好幾天,開始的時候在網上找到一個伺服器控制項,用了一下,發現滿足不了自己的需求。於是乎花了幾個小時改了改,終於成形。這個控制項和別人不同有以下兩點:
 1,一般的dropdownlist都會預設選中第一條,這樣的話,在選擇第一條的時候就沒有事件,而往往這時候我們需要觸發ongchange事件,於是我在它的foucus事件中強行改變它的selectedIndex。
2,輸入的內容如果和下拉框中的某項相同時,會自動選中下拉框中那一條。

using System;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.ComponentModel;
using System.Collections;

namespace ExtendWebControls
{

 [ToolboxData("<{0}:DropDownListExtend runat=\"server\" />")]
 public class DropDownListExtend : System.Web.UI.WebControls.TextBox
 {
  private Hashtable _values;
  private DropDownList _DropDownList;

  public DropDownListExtend()
  {
   _values = new Hashtable();
   _DropDownList = new DropDownList();
  }

  public Hashtable Values
  {
   get{return _values;}
   set{_values = value;}
  }

  protected override void Render(HtmlTextWriter output)
  {

   int iWidth = Convert.ToInt32(base.Width.Value);
   if(iWidth == 0)
   {
    iWidth = 102;
    base.Width = Unit.Parse("102px");
   }

   int sWidth = iWidth + 16;
   int spanWidth = sWidth - 18;

   output.Write("<div style=\"POSITION:relative\">");
   output.Write("<span style=\"MARGIN-LEFT:" + spanWidth.ToString() + "px;OVERFLOW:hidden;WIDTH:18px\">");

   _DropDownList.Width = Unit.Parse(sWidth.ToString() + "px");
   _DropDownList.Style.Add("MARGIN-LEFT", "-" + spanWidth.ToString() + "px");
   _DropDownList.ID = base.ID + "_Select";
   _DropDownList.Attributes.Add("onchange", "this.parentNode.nextSibling.value=this.value");
   _DropDownList.Attributes.Add("onfocus", ""+this.getFocusScript()+"");
   
   if(_values.Count > 0)
   {
    foreach(string key in _values.Keys)
    {
     ListItem item = new ListItem();

     item.Value = key;
     item.Text = _values[key].ToString();

     _DropDownList.Items.Add(item);
    }
   }
   _DropDownList.RenderControl(output);

   output.Write("</span>");

   base.Style.Clear();
   base.Width = Unit.Parse(iWidth.ToString() + "px");
   base.Style.Add("left", "0px");
   base.Style.Add("POSITION", "absolute");
   base.Render(output);
   
   output.Write("</div>");
  }

  private string getFocusScript()
  {
   string strScript = "\n";
   strScript += "var isExist = -2;\n";
   strScript += "var obj = event.srcElement;\n";
   strScript += "var str = this.parentNode.nextSibling.value;\n";
   strScript += "var ary = obj.options;\n";
   strScript += "for(var i=0;i<ary.length;i++){\n";
   strScript += " if(str == ary[i].text){\n";
   strScript += "  isExist = i;\n";
   strScript += "  break;\n";
   strScript += " }\n";
   strScript += "}\n";
   strScript += "if(isExist != -2){\n";
   strScript += " obj.selectedIndex = isExist;\n";
   strScript += "}\n";
   strScript += "else{\n";
   strScript += " obj.selectedIndex = -1;\n";
   strScript += "}\n";
    
   return strScript;
  }
 }
}

相關文章

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.