AutoPostBack conflict with jQuery

Question

I want to do this but in asp.net. How would I write this in asp.net/the code behind? I already have

protected void chkBox_CheckedChanged(object sender, EventArgs e)
{
    if (chkBox.Checked){}
    else{}
}

with

<asp:Checkbox ID="chkBox" AutoPostBack="True" runat="server"
      onCheckedChanged="chkBox_CheckedChanged" />

so I need help filling in the rest. Seriously though, thanks so much!

UPDATE 2: This method works but the message/div doesn't show long enough to read the text. Found out it's due to AutoPostBack="true". How do I call the event after the AutoPostBack is done (I'm guessing that's what I need to solve the problem)?

function displayDiv(checkbox) {
            if (checkbox.checked) {
                $("#message1").stop(true, true).show().fadeOut(10000);
                $("#message2").hide();
            }
            else {
                $("#message1").stop(true, true).hide();
                $("#message2").stop(true, true).show().fadeOut(10000);
            }
        }


<asp:CheckBox ID="chkNotifyMe" AutoPostBack="True" runat="server"   OnCheckedChanged="chkNotifyMe_CheckedChanged" onclick="displayDiv(this)" /> 
<div id="message1" class="message" ><span>Successfully <small></small></span></div><br />
<div id="message2" class="message" ><span>Removed<small></small></span></div>

(all css is the same)

So close I can taste it :D Thanks again!

FINAL SOLUTION Alright I added this to my page to call the AutoPostBack through jQuery and after it posts, to display my message

function pageLoad() {
            <%# autoLaunchJS %>
             $("#chkNotifyMe").click(chkNotifyMe_clicked);
        }
function chkNotifyMe_clicked(){
    var add = $get("chkNotifyMe").checked == true;
    PageMethods.WishList(add, <%#ID%>, OnSucceeded, OnFailed);
    }

    function OnSucceeded(){
        refreshStartPage();
        if($get("chkNotifyMe").checked){
                    $("#messageSuccess").stop(true, true).show().fadeOut(5000);
                    $("#messageRemove").hide();
        }
        else{
            $("#messageSuccess").stop(true, true).hide();
            $("#messageRemove").stop(true, true).show().fadeOut(5000);
            }
    }

Answer 1

You can have client code and server logic at the same time for a server control. If the display of that div is all you are planning to do, then it's pure view logic and it definitely something to do with javascript and posting back to server and refreshing the view would be wasteful.

You can slightly change your javascript to do this

function displayDiv(checkBox) {
        if (checkBox.checked) {
                            $("#message1").stop(true,true).show().fadeOut(4000);
            $("#message2").hide();
        }
        else {
            $("#message1").stop(true,true).hide();
            $("#message2").stop(true,true).show().fadeOut(4000);
        }

    }

and

<asp:Checkbox ID="chkBox" AutoPostBack="True" runat="server"
      onCheckedChanged="chkBox_CheckedChanged" onclick="displayDiv(this)" />