Question

我正在尝试根据要检查的复选框设置按钮的启用/禁用。下面是我的javascript和asp代码，它不起作用。我不确定函数是否完全没有被调用，或者我是如何禁用按钮的。

<script type="text/javascript">

function OnChkAgreeChanged(chkAgree) {
    if (document.getElementById"chkAgree").checked)
        document.getElementById("btnSubmit").SetEnabled(true);
    else
        document.getElementById("btnSubmit").SetEnabled(false);
}
</script>


<asp:checkbox ID="chkAgree" runat="server" 
    Text="blablabla" onchange="javascript:OnChkAgreeChanged(this);"/>


<dx:ASPxButton ID="btnSubmit" runat="server" Text="Submit" 
    UseSubmitBehavior="true" AutoPostBack="true" Width="175px" 
    CssClass="submitButton" OnClick="btnSubmit_Click" enabled="false">
</dx:ASPxButton>

Answer 1

chkAgree是一个不是字符串的对象。您不必使用document.getElementById。试试这个......

<script type="text/javascript">

function OnChkAgreeChanged(chkAgree) {
    if (chkAgree.checked)
        document.getElementById("btnSubmit").disabled = null;
    else
        document.getElementById("btnSubmit").disabled = true;
}
</script>

此外，在onchange="javascript:OnChkAgreeChanged(this);" javascript中：可能不需要。请检查ASP文档。

Answer 2

DevExpress为其中的每个控件创建一个客户端实例对象。在这种情况下，它将为btnSubmit创建ASPxClientButton。由于您还没有给btn提交ClientInstanceName，您可以这样访问它：

window.aspxGetControlCollection().elements['<%= btnSubmit.ClientID %>'];

这意味着你的整个处理函数看起来像这样：

function OnChkAgreeChanged(chkAgree) 
{
    btnSubmit = window.aspxGetControlCollection().elements['<%= btnSubmit.ClientID %>'];
    if(!(btnSubmit === null || btnSubmit === undefined)) { btnSubmit.SetEnabed(chkAgree.checked); }
}

您还可以通过定义ClientInstanceName属性来简化您的生活：

<dx:ASPxButton ID="btnSubmit" ClientInstanceName="btnSubmit" runat="server" Text="Submit" 
    UseSubmitBehavior="true" AutoPostBack="true" Width="175px" 
    CssClass="submitButton" OnClick="btnSubmit_Click" enabled="false">
</dx:ASPxButton>

然后，您可以直接在您的处理程序中使用它：

function OnChkAgreeChanged(chkAgree) 
{
    if(!(btnSubmit === null || btnSubmit === undefined)) { btnSubmit.SetEnabed(chkAgree.checked); }
}

你会注意到我想检查那个东西是否为空，因为如果你在Code-Behind中将显示设置为none或以其他方式禁用它，它很可能是DevExpress魔法/ voodoo（选择一个）不会发出创建该实例对象的JS。

Answer 3

JQuery解决方案

$(document).ready(function () {
    $('#chkAgree').click(function () {
        if (this.checked) {
            $("#btnSubmit").prop('disabled', false);
        }
        else {
            $("#btnSubmit").prop('disabled', true);
        }
    });
});

或者，如果你想使用JavaScript做同样的事情，可以使用mohkhan建议的解决方案。

Answer 4

为此目的使用 ClientInstanceName 和 ClientEnabled （而不是已启用）属性：

function OnChkAgreeChanged(chkAgree) {
    var checked = chkAgree.checked;
    btnSubmit.SetEnabled(checked);
}
</script>


<asp:checkbox ID="chkAgree" runat="server" Text="blablabla" onchange="OnChkAgreeChanged(this);"/>

<dx:ASPxButton ... ClientInstanceName="btnSubmit" ClientEnabled="False">
</dx:ASPxButton>

禁用dx aspxbutton

4 个答案: