Question

我正在使用Bootstrap和ASP.Net开展我的第一个项目。我打算使用Bootstrap徽章来指示LinkButton上的计数，我将其用作标签。从代码隐藏的页面加载更新计数。

徽章上的计数在页面加载时正确显示，并且它也在第一次回发时（切换选项卡时）但在第二次（以及后续回发）时，前一个活动按钮的按钮文本和徽章图标丢失

以下是使用2个按钮的示例，但我的项目包含4个按钮，因此按钮逐个更改，而不是一次更改。在这个例子中，我看到第二次点击时两个按钮一下子变成空白。

我做错了什么，有没有更好的方法呢？

badge_test.aspx

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="badge_test.aspx.cs" Inherits="pages_badge_test" %>
<!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">
    <meta name = "viewport" content = "width = device-width, initial-scale = 1">
    <script type="text/javascript" src="../extras/jquery-2.1.0.js"></script>
    <link rel="Stylesheet" type="text/css" href="../css/bootstrap.css" />
    <link rel="Stylesheet" type="text/css" href="../css/bootstrap-theme.css" />
    <script type="text/javascript" src="../js/bootstrap.js"></script>
</head>
<body>
    <form id="form1" runat="server">
        <div class="btn-group" role="group">
            <asp:LinkButton ID="lnkBtnTask" class="btn btn-sm btn-primary" role="Button" runat="server" OnClick="lnkbtnMyTasks_Click" >My Tasks<span id="spnMyTask" runat="server" class="badge">0</span></asp:LinkButton>
            <asp:LinkButton ID="lnkBtnReqst" class="btn btn-sm btn-default" role="Button" runat="server" OnClick="lnlbtnMyReqst_Click" >My Requests<span id="spnMyReq" runat="server" class="badge">0</span></asp:LinkButton>
        </div>
    </form>
</body>
</html>

badge_test.aspx.cs [代码隐藏文件]

using System;

public partial class pages_badge_test : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
        spnMyTask.InnerText = "5";
        spnMyReq.InnerText = "10";
    }
    protected void lnkbtnMyTasks_Click(object sender, EventArgs e)
    {
        lnkBtnTask.CssClass = "btn btn-sm btn-primary";
        lnkBtnReqst.CssClass = "btn btn-sm btn-default";
    }
    protected void lnlbtnMyReqst_Click(object sender, EventArgs e)
    {
        lnkBtnTask.CssClass = "btn btn-sm btn-default";
        lnkBtnReqst.CssClass = "btn btn-sm btn-primary";
    }
}

初始加载的屏幕截图（第一个按钮处于活动状态），第一个回发（点击第二个按钮），第二个回发（点击第一个按钮）

编辑：如果我从链接按钮中移除徽章和范围标记，则可以正常使用。

Answer 1

似乎ViewState导致了该问题，关闭了LinkButton的{{1}}的视图状态，并为span标记ViewStateMode="Disabled"启用了它，并且它开始正常工作，并启用了徽章

ViewStateMode="Enabled"

ASP.Net - 第二次回发后按钮上缺少Bootstrap-Badge

1 个答案: