我有一个带有2个项目的radioButtonList。具有“是”值的radiobutton和具有“否”值的radionButton。
下面我选择了“是”radioButton并且选择“否”时隐藏了我想要的面板。我最初使用AutoPostBack属性实现了这个,但是我想在Javascript中实现它,这样它就不会导致回发。这是代码。任何帮助将不胜感激。
<asp:RadioButtonList ID="rbl1" runat="server" onClick="changed(this);" >
<asp:ListItem Value="Yes">Yes</asp:ListItem>
<asp:ListItem Value="No">No</asp:ListItem>
<asp:Panel ID="panel1" runat="server">
<--other controls here -->
</asp:Panel>
function changed(rbl) {
//not sure what to put in here
}
提前致谢,
的ZAP
答案 0 :(得分:3)
以下是我编写的一个简单示例:
<!-- Used grouped radio buttons instead of the RadioButtonList as it is harder to deal with -->
<asp:RadioButton ID="rbYes" runat="server" Text="Yes" GroupName="YourGroupName" Checked="true" />
<asp:RadioButton ID="rbNo" runat="server" Text="No" GroupName="YourGroupName" />
<br /><br />
<!-- Use a div instead of a panel. Panels are just glorified divs. -->
<div id="divTest">
This is a test
</div>
<script type="text/javascript">
$(document).ready(function()
{
$('#<%= rbYes.ClientID %>').click(function() { $('#divTest').show(); });
$('#<%= rbNo.ClientID %>').click(function() { $('#divTest').hide(); });
});
</script>
答案 1 :(得分:1)
function OnclickPanelHide() {
if (this.value == "No") {
document.getElementByID('<%=panel1.ClientID%>').style.display = "none";
}
else {
document.getElementByID('<%=panel1.ClientID%>').style.display = "block";
}
}
</script>
Raja你的代码中有一些错误我刚删除它
答案 2 :(得分:0)
如果你添加一个类或确定“panel1”的真实id,你可以使用jQuery轻松隐藏它:
$('idOfPanel').hide();
或者你没有使用jQuery,使用div / panel的id:
idOfPanel.style.display = "none";
重新显示:
$('idOfPanel').show();
或
idOfPanel.style.display = "block";
答案 3 :(得分:0)
试试这个:
if (this.value == "No")
{
document.getElementByID('<%=panel1.ClientId%').style.display = "none";
}
else
{
document.getElementByID('<%=panel1.ClientId%').style.display = "block";
}
希望它有所帮助。
答案 4 :(得分:0)
如果您不介意进行部分回发,您也可以将代码放入UpdatePanel
(假设您不想回发,以便整个页面不必经过页面生命周期)。