RegisterClientScriptBlock placing scripts together in same block on mobile browser

Question

I have an aspx web page with a few jquery functions placed in a separate asp content placeholder. The scripts are called from code behind when a modalpopup with an update panel (set to conditional update) is opened. They are called using RegisterClientScriptBlock.

Upon loading the modal in a desktop browser, the scripts work fine and I receive no errors (checked using browser debug console); however, opening the modal while in a mobile browser causes an unexpected identifier error caught by the console. Checking the source page on the browser debugger reveals that when in the mobile browser, the RegisterClientScriptBlock calls are placed in the same block as another script call from the master page. This prevents the animations from happening.

Code:

<script type="text/javascript">

    function AnimateBar(width) {
        $(".progress-bar").animate({
            width: width + "%"
        }, 2500);

        $(".progressShow").text(width + "% Complete");

    };

    function fadeInItems() {
        var items = $('.jobTrackingWell').hide();
        var i = 0;
        (function displayItem() {
            items.eq(i++).delay(5).fadeIn(350, displayItem);
        })();

    };


</script>

Code Behind:

ScriptManager.RegisterClientScriptBlock(Me, GetType(Page), "JobTrackingScript", "AnimateBar(" & progbaramount & ")", True)
 ScriptManager.RegisterClientScriptBlock(Me, GetType(Page), "JobTrackingScript2", "fadeInItems()", True)

I have tried:

-Assigning an ID to the script block on the aspx page

-Ensuring that the key provided in the RegisterClientScriptBlock calls aren't the same key specified in the master page RegisterClientScriptBlock call

-Combining the RegisterClientScriptBlock calls into one like so:

ScriptManager.RegisterClientScriptBlock(Me, GetType(Page), "JobTrackingScript", "AnimateBar(" & progbaramount & ");fadeInItems()", True)

-Placing semicolons after each function call in each RegisterClientScriptBlock

-Using RegisterStartupScript (I see that it places it at the bottom of the page)

-Ensuring there are no differences in the script placeholder between the master page and the mobile master

Kinda stumped since the page only has issues on the mobile browser. Could this be an issue with the fact that this script is called during and updatepanel event?

Answer 1

RegisterClientScriptBlock and RegisterStartupScript do not "call" javascript functions, they only add new script to the page.

RegisterClientScriptBlock adds new code after the opening form tag; RegisterStartupScript adds code to the end of the page.

Your script is already on the page so you should not have to do either one.

Call your functions with javascript when the modal loads.