使用单选按钮在GridView控件 [英] using radiobuttons in a gridview control
问题描述
我在其中的数据是使用存储过程dispalyed GridView控件。网格有三列，第一个包含单选按钮。总的想法是，用户应该能够选择只有一个单选按钮（在我的情况）5单选按钮。
在present功能的问题是，我可以选择在同一时间所有单选按钮。我使用组名property..it没有工作试过组单选按钮。
我该如何解决呢？
下面是GridView控件
＆LT; ASP：GridView的UseAccessibleHeader =真正的ID =GridView1的CssClass =顶EmptyDataText =HeaderStyle-的CssClass =griditem_headingHeaderStyle-背景色=RUNAT =服务器AllowSorting =真的AutoGenerateColumns =FALSE的cellpadding =0WIDTH =100％＆GT;
＆LT; EmptyDataRowStyle /＆GT;
＆LT; EmptyDataTemplate＆GT;
＆LT;表CELLSPACING =0的cellpadding =0BORDER =0ID =dgd_Clinic_emptyWIDTH =100％＆GT;
＆所述; TR＆GT;
＆LT; TD VALIGN =中间ALIGN =中心的bgcolor =＃cce57f级=griditem_1＆GT;
＆LT;跨度类=smalltableheading＆GT;＆安培; NBSP;＆安培; NBSP;＆安培; NBSP;＆LT; / SPAN＆GT;
＆LT; / TD＆GT;
＆LT; TD VALIGN =中间ALIGN =中心的bgcolor =＃cce57f级=griditem_1＆GT;
＆LT;跨度类=smalltableheading＆GT;诊所名称＆LT; / SPAN＆GT;
＆LT; / TD＆GT; ＆LT; TD VALIGN =中间ALIGN =中心的bgcolor =＃cce57f级=griditem_1＆GT;
＆LT;跨度类=smalltableheading＆GT;开放＆LT; / SPAN＆GT;
＆LT; / TD＆GT;
＆LT; / TR＆GT;
＆所述; TR＆GT;
＆LT; TD合并单元格=8ALIGN =中心＆GT;
＆LT;跨度类=内容＆GT;＆LT; B＆GT;没有符合条件的记录被发现与LT; / B＆GT;＆LT; / SPAN＆GT;
＆LT; / TD＆GT;
＆LT; / TR＆GT;
＆LT; /表＆gt;
＆LT; / EmptyDataTemplate＆GT;
＆LT;柱体和GT;
＆LT; ASP：的TemplateField的HeaderText =HeaderStyle-的CssClass =griditem_headingItemStyle-的CssClass =griditem_1
HeaderStyle-HorizontalAlign =中心HeaderStyle-VerticalAlign =中东SORTEX pression =
可见=真ItemStyle-VerticalAlign =中ItemStyle-HorizontalAlign =中心＆GT;
＆LT;＆ItemTemplate中GT;
＆LT; ASP：标签为=rad1_1ID =rad1_1=服务器可见=假＆GT; ＆LT; / ASP：标签＆gt;
＆LT; ASP：单选按钮ID =rdoClinicId=服务器/＆GT;
＆LT; / ItemTemplate中＆GT;
＆LT; / ASP：的TemplateField＆GT;
＆LT; ASP：的TemplateField的HeaderText =诊所名称HeaderStyle-的CssClass =griditem_heading
ItemStyle-的CssClass =griditem_1HeaderStyle-HorizontalAlign =中心HeaderStyle-VerticalAlign =中东
SORTEX pression =clinic_name可见=真ItemStyle-VerticalAlign =中ItemStyle-HorizontalAlign =中心＆GT;
＆LT;＆ItemTemplate中GT;
＆LT; ASP：标签ID =lbl_Grd_Clinic_Name=服务器文本=工具提示=WIDTH =HEIGHT =
风格=/＆GT;
＆LT; / ItemTemplate中＆GT;
＆LT; / ASP：的TemplateField＆GT;
＆LT; ASP：的TemplateField的HeaderText =打开HeaderStyle-的CssClass =griditem_heading
ItemStyle-的CssClass =griditem_1HeaderStyle-HorizontalAlign =中心HeaderStyle-VerticalAlign =中东
SORTEX pression =打开可见=真ItemStyle-VerticalAlign =中东
ItemStyle-HorizontalAlign =中心＆GT;
＆LT;＆ItemTemplate中GT;
＆LT; ASP：标签ID =lbl_Grd_Open=服务器文本=工具提示=WIDTH =HEIGHT =类型=/＆GT;
＆LT; / ItemTemplate中＆GT;
＆LT; / ASP：的TemplateField＆GT;＆LT; /专栏＆GT;
＆LT; / ASP：GridView的＆GT;
由于 GridView控件呈现为表元素，在运行时，它会赋予不同的名字，以每个单选按钮给组名获得'T的工作。
但要求验证单选按钮JavaScript函数在一个时间，而不是给多个单选按钮相同的组名以外的GridView控件选择一个单选按钮。
JavaScript函数将当前选中的单选按钮的样式的行以确定该行被选中，然后通过在GridView单选按钮循环，然后取消选择previous选定的单选按钮，并设置行样式设置回默认值。
请参阅下面的code，
JavaScript部分，
＆LT; SCRIPT LANGUAGE =JavaScript的类型=文/ JavaScript的＆GT;
功能CheckOtherIsCheckedByGVID（RB）{
VAR =器isChecked rb.checked;
VAR排= rb.parentNode.parentNode; VAR currentRdbID = rb.id;
父=的document.getElementById（＆下;％= GridView1.ClientID％gt;中）;
VAR项目= parent.getElementsByTagName（'输入'）; 对于（i = 0; I＆LT; items.length;我++）{
如果（项目[I] .ID = currentRdbID和放大器;！＆放大器;项目[I] .TYPE ==单选）{
如果（项目[I] .checked）{
项目由[i] = .checked虚假的;
}
}
}
}
＆LT; / SCRIPT＆GT;
.aspx的部分，
＆LT; ASP：GridView控件ID =GridView1=服务器的AutoGenerateColumns =false的＆GT;
＆LT;柱体和GT;
＆LT; ASP：的TemplateField＆GT;
＆LT;＆ItemTemplate中GT;
＆LT; ASP：单选=服务器ID =RadioButton1的onclick =JavaScript的：CheckOtherIsCheckedByGVID（本）;＆GT;
＆LT; / ASP：单选＆GT;
＆LT; / ItemTemplate中＆GT;
＆LT; / ASP：的TemplateField＆GT;
＆LT; /专栏＆GT;
＆LT; / ASP：GridView的＆GT;
注意：此处的onclick采用的是日html属性，并会的Visual Studio智能感知属性中出现。在我的code提供那么只需输入这一点。
我测试了这一点，并完美地为我工作。
希望这会为你工作。
I have a gridview control in which the data is dispalyed using a stored procedure. the grid has three columns, first one contains radiobuttons. the general idea is that the user should be able to select only one radiobutton from (in my case) 5 radiobuttons.
The problem in the present functionality is that i can select all the radiobuttons at the same time. I tried group the radiobuttons using 'groupname' property..it didn't work.
How can i fix it?
Here is the gridview control
<asp:GridView UseAccessibleHeader="true" ID="GridView1" CssClass="top" EmptyDataText="" HeaderStyle-CssClass="griditem_heading" HeaderStyle-BackColor="" runat="server" AllowSorting="True" AutoGenerateColumns="False" CellPadding="0" Width="100%">
<EmptyDataRowStyle />
<EmptyDataTemplate>
<table cellspacing="0" cellpadding="0" border="0" id="dgd_Clinic_empty" width="100%">
<tr>
<td valign="Middle" align="Center" bgcolor="#cce57f" class="griditem_1">
<span class="smalltableheading"> </span>
</td>
<td valign="Middle" align="Center" bgcolor="#cce57f" class="griditem_1">
<span class="smalltableheading">Clinic Name</span>
</td>
<td valign="Middle" align="Center" bgcolor="#cce57f" class="griditem_1">
<span class="smalltableheading">Open</span>
</td>
</tr>
<tr>
<td colspan="8" align="Center">
<span class="Content"><b>No matching records were found.</b></span>
</td>
</tr>
</table>
</EmptyDataTemplate>
<Columns>
<asp:TemplateField HeaderText="" HeaderStyle-CssClass="griditem_heading" ItemStyle-CssClass="griditem_1"
HeaderStyle-HorizontalAlign="Center" HeaderStyle-VerticalAlign="Middle" SortExpression=""
Visible="True" ItemStyle-VerticalAlign="Middle" ItemStyle-HorizontalAlign="Center">
<ItemTemplate>
<asp:Label for="rad1_1" ID="rad1_1" runat="server" Visible="false"> </asp:Label>
<asp:RadioButton ID="rdoClinicId" runat="server" />
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Clinic Name" HeaderStyle-CssClass="griditem_heading"
ItemStyle-CssClass="griditem_1" HeaderStyle-HorizontalAlign="Center" HeaderStyle-VerticalAlign="Middle"
SortExpression="clinic_name" Visible="True" ItemStyle-VerticalAlign="Middle" ItemStyle-HorizontalAlign="Center">
<ItemTemplate>
<asp:Label ID="lbl_Grd_Clinic_Name" runat="Server" Text="" ToolTip="" Width="" Height=""
Style="" />
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Open" HeaderStyle-CssClass="griditem_heading"
ItemStyle-CssClass="griditem_1" HeaderStyle-HorizontalAlign="Center" HeaderStyle-VerticalAlign="Middle"
SortExpression="Open" Visible="True" ItemStyle-VerticalAlign="Middle"
ItemStyle-HorizontalAlign="Center">
<ItemTemplate>
<asp:Label ID="lbl_Grd_Open" runat="Server" Text="" ToolTip="" Width="" Height="" Style="" />
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
Since a gridview is rendered as table element , at run time it will assign different "name" to each radio button giving GroupName won't work.
But calling a JavaScript function for validating the radio button to select one radio button at a time instead of giving same GroupName for multiple radio button outside gridview.
The javascript function sets the row of the current selected radio button's style to determine that the row is selected and then loops through the radio buttons in the gridview and then de-select the previous selected radio button and set the row style back to its default.
See the code below,
JavaScript section,
<script language="javascript" type="text/javascript">
function CheckOtherIsCheckedByGVID(rb) {
var isChecked = rb.checked;
var row = rb.parentNode.parentNode;
var currentRdbID = rb.id;
parent = document.getElementById("<%= GridView1.ClientID %>");
var items = parent.getElementsByTagName('input');
for (i = 0; i < items.length; i++) {
if (items[i].id != currentRdbID && items[i].type == "radio") {
if (items[i].checked) {
items[i].checked = false;
}
}
}
}
</script>
Aspx section,
<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="false">
<Columns>
<asp:TemplateField>
<ItemTemplate>
<asp:RadioButton runat="server" ID="RadioButton1" onclick="javascript:CheckOtherIsCheckedByGVID(this);">
</asp:RadioButton>
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
NOTE: the onclick used here is th html property and will appear within intellisense property of visual studio. So just type this as provided in my code.
I tested this and worked perfectly for me.
Hope this will work for you..
这篇关于使用单选按钮在GridView控件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
