Question

我在ASP.net，C＃网站上使用bootstrap。单选按钮和复选框的回发事件无效。

我们如何解决这个问题，或者如何从单选按钮或复选框中删除CSS或JQuery。

代码

    <asp:RadioButton ID="rdbtn1" runat="server" Text="Check me" 
        AutoPostBack="true" OnCheckedChanged="radio_checked"/> 
    <asp:CheckBox ID="chk1" runat="server" Text="radio button" 
        AutoPostBack="true" OnCheckedChanged="chk_checked" />

Answer 1

如果你正在使用bootstrap，那么这个问题来自coz bootstrap改变所有复选框和单选按钮的样式并在DIV内显示那些以改变复选框和无线电的外观。 AND AutoPostBack适用于点击事件，但点击事件会转到DIV。

所以解决方案是使用on checked change事件。最好的方法是使用jQuery。

在这上面添加一个脚本：

<script type="text/javascript">
    $(function () {
        $("#idOfCheckbox").on('ifToggled', function (event) {
            __doPostBack('idOfCheckbox','');
        });
        $("#idOfRadio").on('ifToggled', function (event) {
            __doPostBack('idOfRadio','');
        });
    });
</script>

您可以将其称为辅助/备用方法来设置AutoPostBack=true，这适用于所有输入。

Answer 2

Bootstrap Javascript在单选按钮/复选框控件周围添加标签，捕获点击。控件的AutoPostBack onclick永远不会被调用。要解决此问题，请将标签的onclick设置为与控件的onclick相同。

// Fix AutoPostBack issue due to Bootstrap Javascript
protected void RadioButton_FixAutoPostBack_OnPreRender(object sender, EventArgs e)
{
    RadioButton radioButton = (RadioButton)sender;
    HtmlGenericControl label = (HtmlGenericControl)radioButton.Parent;

    // Set onclick handler of the parent label to be the same as the radio button.
    //   This fixes issues caused by bootstrap javascript which adds labels.
    label.Attributes.Add("onclick", 
        "javascript:setTimeout('__doPostBack(\\'" + 
        radioButton.UniqueID + "\\',\\'\\')', 0)");
}

ASPX：

<label class="btn btn-yes" runat="server" id="LabelFoo">
    <asp:RadioButton ID="RadioButtonFoo" runat="server"
        AutoPostBack="true"
        OnPreRender="RadioButton_FixAutoPostBack_OnPreRender"
        OnCheckedChanged="RadioButtonFoo_CheckedChanged" />
</label>

单选按钮回发事件不使用bootstrap，asp.net

2 个答案: