Cant invoke jquery function from asp.net code behind
<p>Im new to javascript/Jquery</p>

<p>I have made a javascript/Jquery applet witch i will use to display feedback from my asp.net application to the end user. Like a fancy pop up that slides in and have different functionality depending if the message is of status "error" "alert" or "success".</p>

<p>(I know this has been done before and there are plug ins and stuff to do it. Im not posting this cause i need the solution solved, im posting because i need to understand what i am doing wrong and learn how to properly invoke my js/jq functions.)</p>

<p>The asp.net codebehind method that invokes the jq function uses the RegisterClientScriptBlock(); The method works if i just put alert("whatever"); instead of invoking the pop up function. If i make a dummy js function outside of the document ready it also works. But when i try and invoke my pop up alert function nothing happens. It doesnt even go inside the function.</p>

<p>C#</p>

<pre><code>public void SendPopUp()
{
string key = Guid.NewGuid().ToString();
StringBuilder javascript = new StringBuilder();

javascript.Append("$(document).ready(function() {");
javascript.Append(" AlertPopUp('Horror', 'Oh nooo, an error is simulated!', 'error');");

 javascript.Append(" });");

// Gets the executing web page 
Page page = HttpContext.Current.CurrentHandler as Page;


ScriptManager sm = ScriptManager.GetCurrent(page);


if (sm != null &amp;&amp; sm.IsInAsyncPostBack)
{
    ScriptManager.RegisterClientScriptBlock(page, typeof(Page), key,javascript.ToString() , true);
}
else
{
    page.ClientScript.RegisterClientScriptBlock(this.GetType(), key,javascript.ToString() , true);
}


}
</code></pre>

<p>JAVASCRIPT</p>

<pre><code>&lt;script type="text/javascript"&gt;


    /*
    ------------USER FEEDBACK POPUP-------------
    ---------Lautaro Arino @Viatel 2011---------
    --------------------------------------------
    */




    $(function () {

        // ID of DIVS
        var popUpId = "AlertPopUp";
        var popUpCollapseId = "AlertCollapse";
        var popUpDisbandId = "AlertDisband";
        var titleId = "AlertTitle";
        var messageId = "AlertMessage";
        var bodyId = "AlertBody";
        var headerId = "AlertHeader";
        var imageId = "AlertImage";

        // Get the div objects
        var PopUpBox = $('#' + popUpId);
        var CollapseDiv = $('#' + popUpCollapseId);
        var DisbandDiv = $('#' + popUpDisbandId);
        var TitleDiv = $("#" + titleId);
        var MessageDiv = $("#" + messageId);
        var Image = $('#' + imageId);

        //Paths to error images
        var successImagePath = "images/okej.jpg";
        var alertImagePath = "images/alert.jpg";
        var errorImagePath = "images/error.jpg";
        var rootPathFromThisFile = "../../";

        //parameters
        var anmationSpeed = 300; //milliseconds. speed of the popup showing up, expanding and collapsing
        var fadOutSpeed = 5000; //milliseconds. speed of success messages fading out
        var popupWidth = PopUpBox.width();
        var collapseWidth = DisbandDiv.width() + Image.width();



        //EVENT HANDLERS 
        DisbandDiv.click(function () {
            disbandPoPUp();
        });


        PopUpBox.click(function () {

            if (state == "expanded") {
                collapse();

            } else if (state == "collapsed") {
                expand();
            }
        });

        //testbutton
        $('#btnerror').click(function () {

            AlertPopUp('Jättehemskt!', 'Oh nooo, an error is simulated!', 'error');
        });

        $('#btnalert').click(function () {
            AlertPopUp('Glöm ej. ', 'Glöm ej att köpa mjölk', 'alert');
        });

        $('#btnsuccess').click(function () {
            AlertPopUp('Woho!', 'Någonting har gått som det ska!', 'success');
        });




        //DISBAND
        function disbandPoPUp() {
            // alert("disbanding");
            PopUpBox.stop();
            PopUpBox.css('display', 'none');
            state = "off";
        };

        //COLLAPSE
        function collapse() {
            //  alert("collapsing");
            PopUpBox.animate({ "right": -popupWidth + collapseWidth + 10 + "px" }, 300);
            state = "collapsed";
        };

        //EXPAND 
        function expand() {
            //   alert("expanding");
            PopUpBox.animate({ "right": "-5px" }, 300);
            state = "expanded";
        };





        //AlertPopUp('Jättehemskt!', 'Oh nooo, an error is simulated!', 'error');

        function AlertPopUp(title, message, type) {
          //  alert("function invoked");

            //RESET POSITION
            PopUpBox.css('right', -popupWidth + "px");
            PopUpBox.css('opacity', '1.0');
            PopUpBox.stop(); // in case there is an animation or fade going on

            //SET MESSAGE

            TitleDiv.text(title);
            MessageDiv.text(message);



            // SET POP UP TYPE AND DISPLAY
            if (type == "success") {
                // SUCESS
                setBorderAndImage("green", successImagePath);
                setFadeOut();

            } else if (type == "alert") {
                //ALERT
                setBorderAndImage("orange", alertImagePath);
                displayPopUpExpanded();

            } else {
                //ERROR

                setBorderAndImage("red", errorImagePath);
                displayPopUpExpanded();
            }


            //DISPLAY EXPANDED
            function displayPopUpExpanded() {
                PopUpBox.css('display', 'block');
                expand();
            }



            //DISPLAY COLLAPSED
            function displayPopUpCollapsed() {
                PopUpBox.css('display', 'block');
                collapse();
            }


            function setFadeOut() {
                PopUpBox.css('display', 'block');
                PopUpBox.animate({ "right": "-5px" }, anmationSpeed,
                         function () {
                             state = "expanded";
                             startFadeKill();
                         }
                         );


                function startFadeKill() {
                    PopUpBox.fadeTo(fadOutSpeed, 1.0, function () {//this is just a delay before starting to fade out.
                        PopUpBox.fadeTo(fadOutSpeed, 0.0, function () {
                            //  alert("fade done");
                            disbandPoPUp();
                        });
                    });


                    PopUpBox.mouseenter(function () {
                        //alert("mouse");
                        PopUpBox.stop();
                        PopUpBox.fadeTo("fast", 1.0);
                    });
                }
            }


            //Set border color and image
            function setBorderAndImage(color, imagePath) {
                PopUpBox.css("border-color", color);
                DisbandDiv.css("background-color", color);

                //set image path
                Image.attr("src", rootPathFromThisFile + imagePath);
                }
        };



    })



&lt;/script&gt;
</code></pre>
