如何使用单选按钮列表控件 [英] How to use a radio button list control
本文介绍了如何使用单选按钮列表控件的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我有一个带有2个项目的asp radiobuttonlist6，即'this'和'that'。如果我选择'那个'，我想显示'panel1'。如果我选择'this'，我想隐藏'panel1'。我尝试使用以下代码在任何按钮单击上显示至少panel1。我无法成功。
可以使用javascript函数指导如何满足我的要求。我在javascript中很穷。我在某种程度上提交了以下内容。
I have an asp radiobuttonlist6 with 2 items namely, 'this', and 'that'. If I select 'that' , I want to show 'panel1'. If I select 'this' , I want to hide the 'panel1'. I tried with the following code to show atleast the 'panel1' on any of the button click. I could not succeed in it.
Can any one guide on how to meet my requirements using javascript function. I am poor in javascript. I submit the following with which I tried to some extent.
<script type = "text/javascript">
function Validate() {
if (document.getElementById('<% = Radiobuttonlist6.ClientID %>').checked == 'true')
document.getElementById('<% = Panel1.ClientID %>').style.display = "block";
}
}
</script>
<asp:RadioButtonList ID="Radiobuttonlist6" runat="server"
RepeatDirection="Vertical" AutoPostBack="true" style=" margin-left:10px; margin-top:44px" >
<asp:ListItem>This</asp:ListItem>
<asp:ListItem>That</asp:ListItem>
</asp:RadioButtonList>
<asp:Panel ID="Panel1" runat="server" Width="33" style=" border-style:groove; height:30px; background-color:Red; margin-top:73px">
</asp:Panel>
protected void Page_Load(object sender, EventArgs e)
{
this.Panel1.Style.Add("display", "none");
this.Radiobuttonlist6.Attributes.Add("Checked", "Validate()");
}
推荐答案
你可以在javascript itselt中处理它。
试试
标记代码：
You can handle it in javascript itselt.
Try
Markup Code:
<asp:RadioButtonList ID="Radiobuttonlist6" runat="server"
RepeatDirection="Vertical" AutoPostBack="true" onclick="Validate('Radiobuttonlist6','Panel1')" style=" margin-left:10px; margin-top:44px" >
<asp:ListItem Text="this" Value="this"></asp:ListItem>
<asp:ListItem Text="this" Value="that"></asp:ListItem>
</asp:RadioButtonList>
JS函数：
JS function :
function Validate(rb, panel1)
{
var rb = document.getElementById('rb');
var panel = document.getElementById('Panel1');
var rblist = rb.getElementsByTagName("input");
for (var i = 0; i < rblist.length; i++)
{
if (rblist[i].checked)
{
if (rblist[i].value == "this")
{
panel.style.display = "block";
}
else if (options[i].value == "that")
{
panel.style.display = "none";
}
}
}
}
尝试并还原
希望这有帮助......
Try and revert
Hope this helps...
<script type="text/javascript">
function Validate(radioButtonList) {
for (var i = 0; i < radioButtonList.rows.length; ++i) {
if (radioButtonList.rows[i].cells[0].firstChild.checked) {
if (radioButtonList.rows[i].cells[0].firstChild.value == "This") {
document.getElementById('Panel1').style.display = "none";
}
else
document.getElementById('Panel1').style.display = "block";
}
}
}
</script>
<asp:radiobuttonlist id="Radiobuttonlist6" onclick="Validate(this);" runat="server" xmlns:asp="#unknown">
RepeatDirection="Vertical" style=" margin-left:10px; margin-top:44px" >
<asp:listitem>This</asp:listitem>
<asp:listitem>That</asp:listitem>
</asp:radiobuttonlist>
<asp:panel id="Panel1" runat="server" width="33" style="border-style:groove; height:30px; background-color:Red; margin-top:73px" xmlns:asp="#unknown">
</asp:panel>
我在解决方案窗口粘贴代码时遇到了问题我将代码粘贴到原来并忘记格式化为c＃代码尝试关注
Its my bad while pasting the code on solution window i paste the code as it is and forget to format as c# code try following
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="test1.aspx.cs" Inherits="test1" %>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script type="text/javascript">
function Validate(radioButtonList) {
for (var i = 0; i < radioButtonList.rows.length; ++i) {
if (radioButtonList.rows[i].cells[0].firstChild.checked) {
if (radioButtonList.rows[i].cells[0].firstChild.value == "This") {
document.getElementById('Panel1').style.display = "none";
}
else
document.getElementById('Panel1').style.display = "block";
}
}
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:RadioButtonList id="Radiobuttonlist6" onclick="Validate(this);" runat="server"
RepeatDirection="Vertical" style=" margin-left:10px; margin-top:44px" >
<asp:Listitem>This</asp:Listitem>
<asp:Listitem>That</asp:Listitem>
</asp:RadioButtonList>
<asp:Panel id="Panel1" runat="server" width="33" style="border-style:groove; height:30px; background-color:Red; margin-top:73px">
</asp:Panel>
</div>
</form>
</body>
</html>
这篇关于如何使用单选按钮列表控件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
