在把桌面程序改为 web程序时, 原来程序中用到的一个Infragistics的控件,既能输入又能下啦,下拉显示为一个table, 虽然Infragistics也提供了这样的web control, 但在使用过程中出现了一些bug。设置也比较繁琐。于是只好自己写了。 不过没有写成控件,通用性比较差 1。在服务器端将可选择的值导在一个datagrid中, 设置这个datagrid的display = 'none' 2. 再在服务器端设置datagrid的每个item的onlick值 For i = 0 To dgd.Items.Count - 1 dgd.Items(i).Attributes.Add("onclick", "show(""" + dgd.Items(i).Cells(0).Text.Trim + """,'" + txt.ClientID + "')") dgd.Items(i).Attributes.Add("onMouseOver", "this.className='sel';") dgd.Items(i).Attributes.Add("onMouseOut", "this.className='params';") dgd.Items(i).CssClass = "params" Next 这里必须设置在客户端点击某行时在那个控件现实什么值 3。还在服务器端设置点击的图片的客户端事件 img.Attributes.Add("onclick", "lstParams('" + txt.ClientID + "','" + dgd.ClientID + "')") 显示哪个datagrid中的值在哪个textbox下 4. 在客户端javascript中复制要显示的隐藏的datagrid中的值到一个div中,并设置显示的位置 /<DIV id=divParams style="DISPLAY: none; Z-INDEX: 102; LEFT: 288px; WIDTH: 200px; POSITION: absolute; TOP: 264px; HEIGHT: 115px"/>/</DIV/> function lstParams(txtbox,dgd) { var x,y; var dd=document.all['divParams']; var dpar=document.all[dgd]; var e =document.all[txtbox]; var str; var y=e.offsetTop+e.offsetHeight; var x=e.offsetLeft; while(e=e.offsetParent) { y+=e.offsetTop; x+=e.offsetLeft; } str=dpar.innerHTML; dd.innerHTML="/<table class='paramTB' rules='all' />"+str+"/</table/>"; with(dd.style) { left = x; top =y ; } } 客户端点击事件: function show(value,ctr) { document.all[ctr].value=value; } function hideParams() { var el=window.event.srcElement; if (el.id.indexOf('btnLst')==-1) document.all['divParams'].style.display='none'; else { if( document.all['divParams'].style.display=='none') document.all['divParams'].style.display=''; else document.all['divParams'].style.display='none'; } } window.document.attachEvent("onclick",hideParams); 5。 要模仿得像dropdownlist要设置点击的图片紧靠在textbox旁 IMG id=btnLst style="Z-INDEX: 1;top:4px; LEFT: -5px; POSITION: relative" alt="" src="Images/btn.gif" runat=server 这样就可以模仿一个可输入的dropdownlist下拉为一个table, 点中某行可以将要显示的值显示在输入框中 |
可输入的dropdownlist+服务器端的数据
最新推荐文章于 2013-12-04 18:15:05 发布