2017-05-20 1 views
2

私はログインしているユーザーのためにインボックスを実装している小さなASP.NET MVCアプリケーションに取り組んでいます。ユーザーに2つの未読メッセージがある場合は、文字とアイコンでUnReadとしてマークされているメッセージの数を示しています。<span>タグ</span>とjQueryを使用して値を変更するにはどうすればよいですか?

そして、これは、それがどのように見えるかです:

<i class="fa fa-envelope-o"></i> 
    @if (LoggedInUser != null) 
    { 
      int unReadMessages = Controller.GetNumberOfUnreadMessages(LoggedInUser.LoggedInUserID); 
      if (unReadMessages > 0) 
      { 
      <span class="badge bg-green">@unReadMessages</span> 
      } 
      else 
      { 
       <span class="badge bg-green">@unReadMessages</span> 
      } 

    } 

そして、私は上記のコードでやっていることは次である:ここ enter image description here

をして、これは上記の画像上のように見える作っているコードです:ユーザーがシステムにログインしている場合

チェック:

@if (LoggedInUser != null) 

もしそうであれば、データベースからメッセージを取得します(ここで必要なのは、ユーザーがログインしたときに表示する数字なので、未読としてマークされているメッセージの数をカウントするカウントクエリです)。別のビューで

int unReadMessages = Controller.GetNumberOfUnreadMessages(LoggedInUser.LoggedInUserID); 

私は未読メッセージのリストを持っていると私はそれらのいずれかをクリックしたとき、私はこれは私が私のjavascriptの方法であり、1で(unreadMessages--;のようなもの)

を、この数を減らしたいです未読のメッセージをクリックすると変更はステータスが「読む」ためにデータベースにあります:

私はSO FAR試してみました次のコードでDESRIBEDれているもの
<script type="text/javascript"> 

     function onSelectMessage(el) { 
      $.ajax({ 
       method: "GET", 
       url: "Message/MarkMessageAsRead", 
       data: { messageID: el.id } 
      }) 
    .done(function (response) { 
     $('#email-subject').text(response.subject); 
     $('#email-body').text(response.body); 
     $('#email-date').text(response.created); 
     $('#email-sender').text(response.sender); 

     var unread = el.getAttribute('data-unread'); 
     UpdateMessageStatus(el.id, unread); 

    }); 
     } 

: 私はと呼ばれるspanにIDを追加しました と、それはこのように見えた:私はunReadMessageCounterの値を持っていた私は、その文字の上に私の数を減らすことを願っ内のコード行を追加しましたが、その後

<span class="badge bg-green" id="inboxMessages">@unreadMessages</span> 

は生憎私は失敗した、と私は、コンソールで見ましたNaNとして

var unReadMessageCounter = parseInt($( 'inboxMessages')); --unReadMessageCounter;

私はこの番号を私の手紙(この例では私の場合は:<span class="badge bg-green">の間の2つの値)から得ることができますか?このJavaスクリプトメソッドの@unreadMessagesので、1ステップで私はデータベースを読み取ったものとしてマークし、手紙に表示されているこの番号を減らすことができますか?だからユーザのonSelectMessage javascriptメソッドを呼び出すと、私の番号を表示しているこの整数変数を得ることができ、それを減らすことができます。

おかげでみんな 乾杯

答えて

2

私は、HTMLの違いが表示されていない未読のメッセージがあるかどうかに基づいていますが、ここに私の提案です生成:

はスパンに一意のIDまたはクラス値を与えます容易に選択することができる。このようなもの:

次に、内容を取得して解析し、新しい値を設定します。このようなもの:

var msgCount = $("#unreadMessageBadge").text(); 

if (msgCount !== "") { 
    msgCount = parseInt(msgCount) - 1; 
} 
if (msgCount > 0) { 
    $("#unreadMessageBadge").text(msgCount); 
} else { 
    $("#unreadMessageBadge").hide(); 
} 
関連する問題