2011-07-24 24 views
1

私は自分のサイトにstackoverflow-esqタイプの通知バーを追加しています。サーバー側で 私はディスプレイ用のdivを追加してい:asp.net - ユーザー通知の実装

for (int i = 0; i < dt.Rows.Count; i++) 
     { 
      string script = "<div class='hover-notification' style='display:none;'>"; 
      script += dt.Rows[i]["messageText"].ToString(); 
      if ((bool)dt.Rows[i]["canDismiss"] == false) 
       script += "<span class='dismiss'><a title='Dismiss notification'>x</a></span>"; 
      script += "</div>"; 
      ClientScript.RegisterClientScriptBlock(this.GetType(), "clientScript" + i, script); 

     } 

クライアント側のコードは次のとおりです。

$(document).ready(function() { 
     $('.hover-notification').prependTo('body').slideDown('slow'); 
     $('.dismiss').click(function() { $(this).parent().slideUp('slow').remove(); }); 
    }); 

私はすべてのユーザーに対してメッセージのすべてを保持し、メッセージID、主を持つテーブルを持っていますキー。メッセージはいくつかのイベントでテーブルに追加され、却下されないメッセージは他のイベントで削除されます。 私がしたいことは、ユーザが解読ボタンをクリックすると、メッセージが消滅したとマークすることです。

私はこれを行う方法がわかりません。 誰かが私を正しい方向に向けることができますか?

P.S.私はこれまでに持っていたサーバー側/クライアント側のコードについてのコメントも公開しています。

+0

jsfiddle.netで具体的な例を提供できますか? – ChristopheCVB

+0

@ChristopheCVB - ここに行きます:http://jsfiddle.net/7QS7D/ –

+0

それは今動作していますか? – ChristopheCVB

答えて

1

あなたのニーズを理解している場合は、サーバー側で却下を承認する必要があります。

試してみてください。

$('.dismiss').click(function() { 
    $(this).parent().slideUp('slow').remove(); 
    // ajax request to server 
    $.get('dismiss.asp?id='+this.id); 
}); 

あなたがしなければならない何をしたばかりにプッシュIDを受け、このdismiss.aspを作成することです:

<a id='123' class='dismiss'>x</a> 

私はあなたの質問に答えるだろうか?

+0

あなたの返事をありがとう。あなたはどこにIDを保管しますか? –

+0

タグまたは親では、jsをthis.parentNode.idに変更する必要があります – ChristopheCVB

+0

jsfiddleを例として更新できますか?ありがとう。 –

1

プロジェクトにWCF休憩サービスを追加し、次のようになり、操作コントラクトを定義します。

を次のように単にあなたのWCFサービスを呼び出す、jQueryので

[OperationContract] 
[WebGet(UriTemplate = "MyService/DismissMessage({x})")] 
public bool DismissMessage(int id) { 
    var success = MyLibrary.DismissMessage(id); 
    return success; 
} 

(疑似)さらに読書のために

$.getJSON('MyService/DismissMessage('+messageId+')', function(data) { 
    // do something on success or fail 
} 

、私はあなたがこの記事をチェックすることをお勧め:http://www.codeproject.com/KB/ajax/jQueryWCFRest.aspx