Ich arbeite an meinem ersten Projekt mit Bootstrap zusammen mit ASP.Net. Ich beabsichtige, das Bootstrap-Abzeichen zu verwenden, um Zählungen auf LinkButton anzuzeigen, die ich als Tabs verwende. Die Zählungen werden beim Seitenladen von Codebehind aktualisiert.ASP.Net - Bootstrap-Badge auf Knopf fehlt nach 2. Postback
Die Zählung auf der Plakette wird beim Laden der Seite korrekt angezeigt und funktioniert auch beim 1. Postback (beim Wechseln der Registerkarte), aber beim 2. (und nachfolgenden Postback) fehlt der Schaltflächentext und das Plakettensymbol für die vorherige aktiv Taste.
Unten ist ein Beispiel mit 2 Tasten, aber mein Projekt besteht aus 4 Tasten, so dass sich die Taste 1 zu 1 ändert und nicht alle gleichzeitig. In diesem Beispiel sehe ich, dass beide Tasten beim zweiten Klick gleichzeitig leer sind.
Was mache ich falsch und gibt es einen besseren Weg?
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 [Codebehind-Datei]
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";
}
}
Screenshot auf Initial Load (erste Taste ist aktiv), 1. Postbacks (klicken Sie auf 2. Button), 2. Postback (Klick auf 1. Button)
EDIT: Wenn ich das Abzeichen und die span-Tag von Linkbutton entfernen, funktioniert es gut.