可輸入的dropdownlist+伺服器端的資料

來源:互聯網
上載者:User
伺服器|資料 在把傳統型程式改為 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=http://www.163design.net/a/s/"Images/btn.gif" runat=server

這樣就可以模仿一個可輸入的dropdownlist下拉為一個table, 點中某行可以將要顯示的值顯示在輸入框中



相關文章

E-Commerce Solutions

Leverage the same tools powering the Alibaba Ecosystem

Learn more >

Apsara Conference 2019

The Rise of Data Intelligence, September 25th - 27th, Hangzhou, China

Learn more >

Alibaba Cloud Free Trial

Learn and experience the power of Alibaba Cloud with a free trial worth $300-1200 USD

Learn more >

聯繫我們

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

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