繁体   English   中英

Javascript ASP.net设置单选按钮在模式弹出窗口中启用为false

[英]Javascript ASP.net set radio button enabled to false in modal pop up

通过单击按钮显示模态时,如何将启用的单选按钮设置为false作为默认值。 单击按钮时,它不会禁用单选按钮。 如何正确执行。 谢谢


我的JavaScript函数

function btnDefaultRadios() {

document.getElementById('<%= rdPermanent.ClientID %>').disabled = true;
            document.getElementById('<%= rdNonPermanent.ClientID %>').disabled = true;
            document.getElementById('<%= rdAdministrative.ClientID %>').disabled = true;
            document.getElementById('<%= rdTechnical.ClientID %>').disabled = true;
            document.getElementById('<%= rdWithhRata.ClientID %>').disabled = true;
            document.getElementById('<%= rdContractual.ClientID %>').disabled = true;
            document.getElementById('<%= rdCasual.ClientID %>').disabled = true;
        }

我的按钮触发模式

<asp:Button ID="btnAdd" runat="server" SkinID="button" Text="Add New Position" Width="168px"  OnClientClick="btnDefaultRadios(this);"/>

我的模态-我的控件在面板内

<cc1:ModalPopupExtender ID="ModalPopupExtender1" runat="server" TargetControlID="Label1"
                PopupControlID="pnladd" BackgroundCssClass="modalBackground" OnOkScript="OkButtonClick()">
            </cc1:ModalPopupExtender>

快速的jsfiddle https://jsfiddle.net/8Lq73hye/表示您的JavaScript如果已执行,则应该可以使用。 您可以在浏览器的开发人员工具中设置一个断点,并逐步检查代码以查看禁用逻辑是否确实有效。

可能发生的情况是您的js正在执行,但是单击按钮会导致之后的回发。 如果您在本地计算机上,则可能会在不知情的情况下迅速发生。

为防止意外回发,请确保您的btnDefaultRadios函数返回false

function btnDefaultRadios() {
    document.getElementById('<%= rdPermanent.ClientID %>').disabled = true;
    document.getElementById('<%= rdNonPermanent.ClientID %>').disabled = true;
    document.getElementById('<%= rdAdministrative.ClientID %>').disabled = true;
    document.getElementById('<%= rdTechnical.ClientID %>').disabled = true;
    document.getElementById('<%= rdWithhRata.ClientID %>').disabled = true;
    document.getElementById('<%= rdContractual.ClientID %>').disabled = true;
    document.getElementById('<%= rdCasual.ClientID %>').disabled = true;
    return false;
}

return false将阻止帖子返回。 一个常见的错误是忘记了在OnClientClick调用上返回该函数结果,因此您还必须将OnClientClick更改为

<asp:Button ID="btnAdd" runat="server" ...  OnClientClick="return btnDefaultRadios(this);"/>

编辑:

aspx的简化工作示例:

<%@ Page Language="C#" %>
<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Test Client Side JS on Button Click</title>
    <script>
        function btnDefaultRadios()
        {
            document.getElementById('<%= rdPermanent.ClientID %>').disabled = true;
            document.getElementById('<%= rdNonPermanent.ClientID %>').disabled = true;
            return false;
        }

        function OkButtonClick(){}
    </script>
    <style>
        #pnladd
        {
            background-color: #fff;
        }
         .modalBackground
         {
             background-color: #666;
             background-color: rgba(200,200,200,0.75);
         }
    </style>
</head>
<body>
    <form id="HtmlForm" runat="server">
        <div>
            <asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
            <asp:Label runat="server" ID="Label1">label1</asp:Label>
            <asp:Button ID="btnAdd" runat="server" Text="Add New Position" 
                Width="168px" OnClientClick="return btnDefaultRadios(this);" />
            <asp:Panel runat="server" ID="pnladd" Width="300" Height="300">
                <asp:RadioButton runat="server" ID="rdPermanent" Text="Permanent"/>
                <asp:RadioButton runat="server" ID="rdNonPermanent" Text="Non Permanent"/>
            </asp:Panel>
            <cc1:ModalPopupExtender ID="ModalPopupExtender1" runat="server" TargetControlID="btnAdd"
                PopupControlID="pnladd" BackgroundCssClass="modalBackground" OnOkScript="OkButtonClick()">
            </cc1:ModalPopupExtender>
        </div>
    </form>
</body>
</html>

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM