简体   繁体   English

asp.net服务器端已禁用客户端上已启用单选按钮

[英]asp.net server side disabled Radiobutton enabled on client side

I'm having a strange issue with asp.net enabled state of radiobutton. 我在单选按钮的asp.net启用状态遇到了一个奇怪的问题。

Code in .aspx page : .aspx页面中的代码:

    <%@ Page Language="vb" AutoEventWireup="false" CodeBehind="WebForm1.aspx.vb" Inherits="testradioButton.WebForm1" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <script type="text/javascript" src="https://code.jquery.com/jquery-1.11.1.min.js"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            $('#radYes').change(function () { gererEtat(); });
            $('#radNo').change(function () { gererEtat(); });
        });
        function gererEtat() {
            $('#radDisabledYes').prop('disabled', !$('#radYes').prop('checked'));
            $('#radDisabledNo').prop('disabled', !$('#radYes').prop('checked'));
        }
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:radiobutton ID="radYes" runat="server" GroupName="test" Text="yes"></asp:radiobutton>
        <asp:radiobutton ID="radNo" runat="server" GroupName="test" Text="No"></asp:radiobutton>
    </div>
    <div>
        <asp:radiobutton ID="radDisabledYes" runat="server" GroupName="test2" Text="yes"></asp:radiobutton>
        <asp:radiobutton ID="radDisabledNo" runat="server" GroupName="test2" Text="No"></asp:radiobutton>
    </div>
    <asp:LinkButton ID="lnktoto" runat="server" Text="Submit"></asp:LinkButton>
    </form>
</body>
</html>

And Code Behind : 和背后的代码:

Public Class WebForm1
Inherits System.Web.UI.Page

Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
    If Not IsPostBack Then
        radDisabledYes.Enabled = radYes.Checked
        radDisabledNo.Enabled = radYes.Checked
    End If
    Stop
End Sub

Private Sub Radiobutton1_CheckedChanged(sender As Object, e As EventArgs) Handles radYes.CheckedChanged, radNo.CheckedChanged
    radDisabledYes.Enabled = radYes.Checked
    radDisabledNo.Enabled = radYes.Checked
End Sub

Private Sub lnktoto_Click(sender As Object, e As EventArgs) Handles lnktoto.Click
    Stop
End Sub
End Class

On server side, I disable radio buttons on first load. 在服务器端,我在第一次加载时禁用单选按钮。 I have the same conditions in javascript. 我在javascript中有相同的条件。 So on client side, if user click Yes, I enable some controls. 因此,在客户端,如果用户单击“是”,我将启用某些控件。 I do the same on server side. 我在服务器端也这样做。 It works great with all type of controls except Radio Button. 它适用于除单选按钮以外的所有类型的控件。

Let say that on load, I disable radio buttons. 可以说,在加载时,我禁用了单选按钮。 On client side, base on user input, I enable them (in javascript). 在客户端,基于用户输入,我启用了它们(使用javascript)。 User checked a radio button and submit page. 用户选中了一个单选按钮并提交页面。 On server side, the radio button is disabled and unchecked. 在服务器端,单选按钮已禁用且未选中。 I have code that check the conditions and enable it. 我有检查条件并启用它的代码。 But the radio button is still not checked. 但是单选按钮仍未选中。 I understand why, the server ignore the checked state because at first, it think it is disabled. 我知道为什么服务器会忽略检查状态,因为起初它认为它处于禁用状态。 Is there a way to make this work? 有没有办法使这项工作? I know the server is receiving the checked state because when I check Request.Form, I see radDisable=Yes. 我知道服务器正在接收检查状态,因为当我检查Request.Form时,我看到radDisable = Yes。

Thanks for your help. 谢谢你的帮助。

Here is the hack you are looking for :) 这是您正在寻找的技巧:)

Public Class WebForm1
Inherits System.Web.UI.Page

Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
    If radYes.Checked Then
        radDisabledYes.InputAttributes.Remove("disabled")
        radDisabledNo.InputAttributes.Remove("disabled")
    Else
        radDisabledYes.InputAttributes("disabled") = "disabled"
        radDisabledNo.InputAttributes("disabled") = "disabled"
    End If
    Stop
End Sub

Private Sub Radiobutton1_CheckedChanged(sender As Object, e As EventArgs) Handles radYes.CheckedChanged, radNo.CheckedChanged
    ' not really needed anymore, but lets leave it in here for fun!
End Sub

Private Sub lnktoto_Click(sender As Object, e As EventArgs) Handles lnktoto.Click
    Stop
End Sub
End Class

This essentially bypasses .NET's safety check regarding disabled controls. 这实际上绕过了.NET关于禁用控件的安全检查。 The controls are still enabled/disabled appropriately, but you are doing so without messing with the WebControl.Enabled property. 控件仍然可以适当地启用/禁用,但是您这样做不会弄乱WebControl.Enabled属性。

$(document).ready(function () {
  $('#<%=radYes.ClientID%>').change(function () { gererEtat(); });
  $('#<%=radNo.ClientID%>').change(function () { gererEtat(); });
  function gererEtat() {
    $('#<%=radDisabledYes.ClientID%>').prop('disabled', !$('#<%= radYes.ClientID%>').prop('checked'));
    $('#<%=radDisabledNo.ClientID%>').prop('disabled', !$('#<%=radYes.ClientID%>').prop('checked'));
  }
});

Use 'ClientID' for your control selection in jquery code because control is server control. 由于控件是服务器控件,因此在jquery代码中将“ ClientID”用于控件选择。

ASP.NET can be really paranoid (and rightfully so) about posting back initially disabled controls. 对于回发最初禁用的控件,ASP.NET可能是真正的偏执狂(理应如此)。 So instead of actually disabling them - simulate the effect. 因此,与其实际禁用它们,不如模拟效果。 Eg set attribute onfocus = "this.blur()" - this will prevent clicking the button. 例如,设置属性onfocus = "this.blur()" -这将防止单击按钮。 And when you need to enable the button - remove the attribute. 当您需要启用按钮时-删除属性。

It seems to me that your code behavior is acceptable until the server is unable to identify state changes of radio buttons that it assumes are disabled. 在我看来,您的代码行为是可以接受的,直到服务器无法识别它被假定为禁用的单选按钮的状态更改为止。

Why not just keep a hidden and disabled radio buttonset in the background? 为什么不只在后台保留一个隐藏且禁用的单选按钮集? When you want the disabled look, unhide that set and hide the real ones with JavaScript. 当您想要禁用外观时,请取消隐藏该设置,并使用JavaScript隐藏真实的外观。 Then you never encounter a problem with disabled forms going to the server. 这样,您就永远不会遇到禁用表单进入服务器的问题。

Edit: Upon looking at your question again, I wonder about the need to disable anything on the server side to begin with. 编辑:再次查看您的问题后,我想知道是否需要首先禁用服务器端的任何功能。 Maybe there is a security risk I am not aware of. 也许存在我不知道的安全风险。 An alternate choice might be to leave the buttonset enabled serverside and disable with javascript upon document load. 另一种选择是在服务器端使按钮集保持启用状态,并在加载文档时禁用javascript。

I have one solution its little bit trickey but it can help you out 我有一个解决方案,它有点棘手,但可以帮助您

<script type="text/javascript">
    $(document).ready(function () {
        $('#radYes').change(function () { gererEtat(); });
        $('#radNo').change(function () { gererEtat(); });

        // restore radio button disable status on document ready 
        var status = $("#txtradioStatus").val() == "true" ? true : false;
        $('#radDisabledYes').prop('disabled', !status);
        $('#radDisabledNo').prop('disabled', !status);

    });
    function gererEtat() {
        $('#radDisabledYes').prop('disabled', !$('#radYes').prop('checked'));
        $('#radDisabledNo').prop('disabled', !$('#radYes').prop('checked'));
        // store radio button status in hidden field
        $("#txtradioStatus").val($('#radYes').prop('checked'));
    }

</script>



<div>
    <asp:radiobutton ID="radYes" runat="server" GroupName="test" Text="yes"></asp:radiobutton>
    <asp:radiobutton ID="radNo" runat="server" GroupName="test" Text="No"></asp:radiobutton>
</div>
<div>
    <asp:radiobutton ID="radDisabledYes" runat="server" GroupName="test2" Text="yes"></asp:radiobutton>
    <%-- take hidden field that you can keep status of radio button after postback--%>
    <input type="hidden" runat="server" value="true" id="txtradioStatus" />
    <asp:radiobutton ID="radDisabledNo" runat="server" GroupName="test2" Text="No"></asp:radiobutton>
</div>
<asp:LinkButton ID="lnktoto" runat="server" Text="Submit"></asp:LinkButton>

submitdisabledcontrols="true" this will solve your problem. Submitdisabledcontrols =“ true”这将解决您的问题。 Follow the steps given below. 请遵循以下步骤。

Reason is, you have disabled the control from the server side, even if you enabled it from client using JQuery, SERVER DOES NOT KNOW ABOUT IT. 原因是,即使从客户端使用JQuery启用了该控件,您也已从服务器端禁用了该控件,但是SERVER不知道有关它的信息。 Therefore it keeps the same value as it is not expecting to change the value of a disabled control. 因此,它保持与预期不会更改禁用控件的值相同的值。

There are two things to do. 有两件事要做。

First remove page load code.(Also Radiobutton1_CheckedChanged event not required) 首先删除页面加载代码。(也不需要Radiobutton1_CheckedChanged事件)

Protected Sub Page_Load(ByVal sender As Object, ByVal e As EventArgs) Handles Me.Load
    'If Not IsPostBack Then
    '    radDisabledYes.Enabled = radYes.Checked
    '    radDisabledNo.Enabled = radYes.Checked
    'End If
End Sub

Then change client side code to 然后将客户端代码更改为

 <script type="text/javascript">
    $(document).ready(function () {

        $('#radYes').change(function () { gererEtat(!$('#radYes').prop('checked')); });
        $('#radNo').change(function () { gererEtat(!$('#radYes').prop('checked')); });
        if (!$('#radYes').prop('checked')) {
            gererEtat(true);
        }
    });
    function gererEtat(isEnable) {
        $('#radDisabledYes').prop('disabled', isEnable);
        $('#radDisabledNo').prop('disabled', isEnable);
    }
</script>

finally in the form element add the submitdisabledcontrols="true" attribute. 最后,在form元素中添加Submitdisabledcontrols =“ true”属性。

<form id="form1" runat="server"  submitdisabledcontrols="true" >

run and test the code it will work. 运行并测试它将运行的代码。

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

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