ASP.Net - Bootstrap-Badge在第二回傳後丟失按鈕

我正在使用Bootstrap和ASP.Net一起工作我的第一個項目。我打算使用Bootstrap徽章來指示我用作選項卡的LinkButton上的計數。計數從代碼隱藏的頁面加載更新。ASP.Net - Bootstrap-Badge在第二回傳後丟失按鈕

加載頁面時徽章上的計數正確顯示，並且它也在第1次回發中工作（切換標籤頁時），但在第2次（以及後續回發）上，前一個活動的按鈕文本和徽章圖標丟失按鈕。

下面是一個使用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"; 
    } 
}

截圖上初始加載（第一按鈕處於活動狀態），第一回發（點擊上第2個按鈕），第2個回覆（點擊第1個按鈕）

編輯：如果我從linkbutton刪除徽章和span標籤，它工作正常。

來源

2016-11-04 Spidey

看來ViewState的是導致了問題，關閉了視圖狀態LinkButton的ViewStateMode="Disabled"並啓用它span標籤ViewStateMode="Enabled"，並開始正常工作，與徽章啓用

<asp:LinkButton ID="lnkBtnReqst" ViewStateMode="Disabled" class="btn btn-sm btn-default" 
    role="Button" runat="server" OnClick="lnlbtnMyReqst_Click">My Requests 
    <span id="spnMyReq" runat="server" ViewStateMode="Enabled" class="badge">0</span> 
</asp:LinkButton>

來源

2016-11-05 19:10:40 Spidey

ASP.Net - Bootstrap-Badge在第二回傳後丟失按鈕

回答

相關問題