在datagrid中,我們可能會需要實現這種功能——列的單選,本身datagrid提供了select命令可以實現這種功能。另為也可以利用html 控制項中的radiobutton來實現這樣的功能,當然這也是我們所習慣的。
好的,現在來實現它。 首先在頁面上加入datagrid控制項。
具體格式如下:
〈asp:datagrid id="datagrid1" style="z-index: 101; left: 8px; position: absolute; top: 8px" runat="server" bordercolor="#cc9966" borderstyle="none" borderwidth="1px" backcolor="white" cellpadding="4" autogeneratecolumns="false" width="176px" height="22px"> 〈selecteditemstyle font-bold="true" forecolor="#663399" backcolor="#ffcc66">〈/selecteditemstyle>
〈itemstyle forecolor="#330099" backcolor="white">〈/itemstyle> 〈headerstyle font-bold="true" forecolor="#ffffcc" backcolor="#990000">〈/headerstyle>
〈footerstyle forecolor="#330099" backcolor="#ffffcc">〈/footerstyle> 〈columns>
〈asp:templatecolumn headertext="select">
〈itemtemplate>
〈asp:label id="label2" runat="server">〈/asp:label>
〈/itemtemplate>
〈/asp:templatecolumn>
〈asp:boundcolumn datafield="a" headertext="last name">〈/asp:boundcolumn> 〈/columns>
〈pagerstyle horizontalalign="center" forecolor="#330099" backcolor="#ffffcc">〈/pagerstyle>
〈/asp:datagrid>
再在頁面上加入乙個label(用於顯示我們在datagrid中單選的項)和乙個button(檢視選中項),如下:
〈asp:label id="label3" style="z-index: 103; left: 222px; position: absolute; top: 35px" runat="server" width="184px">〈/asp:label> 〈asp:button id="button1" style="z-index: 102; left: 218px; position: absolute; top: 70px" runat="server" text="display selected value">〈/asp:button〉
在後台**中:
if e.item.itemtype = listitemtype.alternatingitem or e.item.itemtype = listitemtype.item then
dim lbl as label
lbl = e.item.findcontrol("label2")
'加入radio
lbl .text = ""
end if
label3.text = request.form("myradiogroup")
dim i as datagriditem
for each i in datagrid1.items
if i.itemtype = listitemtype.alternatingitem or i.itemtype = listitemtype.item then
dim r as label
r = i.findcontrol("label2")
if r.text.indexof(label3.text) > 0 then
r.text = ""
else
r.text = ""
end if
end if
next
好了,這樣就可以實現利用radio實現datagrid的單選的功能了。
如圖:當我們選中其中一項,點選"檢視選中內容"時,如圖:
在vs.net2003、iis5.0測試通過。
利用jquery操作Radio方法小結
在開發中經常會用到radio來實現使用者的選擇效果,我在專案中積累了一些利用jquery來操作radio的方法,在這裡分享一下,供有需要的朋友借鑑。ps 移除diabled屬性 areaselect removeattr disabled 複製 如下 input radio name dialche...
利用JQUERY來操作Radio的方法
在開發中經常會用到radio來實現使用者的選擇效果,我在專案中積累了一些利用jquery來操作radio的方法,在這裡分享一下,供有需要的朋友借鑑。1 改變radio的選擇,觸發一些效果 複製 如下 input radio name dialcheckresult change function 2...
js實現動態改變radio狀態
h5的radio是自帶選中狀態改變的,但是如果自帶的狀態無法滿足自己的需求時,就需要自己去實現。如下 h5部分 class group class active type radio name parent radio value 1 id new data nclick change 最新資料 t...