asked on

Syntax error when using ASP:UpdateProgress

I have a page that has only 2 buttons, one to show a Toaster and one to show a spinner in an update panel.
The Spinner works fine but when trying to display the toaster I get the error below:

"Uncaught SyntaxError: Unexpected identifier" inspecting the page it highlights the following line:

showToaster('Saved.', 'Room saved.', 'success', 'False', 1000)Sys.Application.add_init(function() {
$create(Sys.UI._UpdateProgress, {"associatedUpdatePanelId":"upnlSpinner","displayAfter":500,"dynamicLayout":true}, null, null, $get("updProgess1"));

If I comment out the ASP:UpdateProgress control, the toaster displays without error.

The full page markup is below:

<%@ Page Language="VB" AutoEventWireup="false" CodeFile="testParse.aspx.vb" Inherits="testParse" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <link href="css/bootstrap.min.css" rel="stylesheet" />
    <link href="font-awesome/css/font-awesome.css" rel="stylesheet" />
    <link href="css/plugins/toastr/toastr.min.css" rel="stylesheet" />
    <link href="css/animate.css" rel="stylesheet" />
    <link href="css/style.css" rel="stylesheet" />
    <script src="js/jquery-2.1.1.js"></script>
    <script src="js/bootstrap.min.js"></script>
    <script src="js/plugins/toastr/toastr.min.js"></script>


    <script>
        function showToaster(title, text, urgencyClass, showButton, waitTime) {

            // showButton = Show a close button on toaster (True or False)
            // waitTime = How long to wait before hiding toaster: 0 = wait forever

            toastr.options = {
                closeButton: false,
                debug: false,
                progressBar: true,
                preventDuplicates: false,
                positionClass: "toast-top-center",
                onclick: null,
                showDuration: 600,
                hideDuration: 1000,
                timeOut: waitTime,
                extendedTimeOut: waitTime,
                showEasing: "swing",
                hideEasing: "linear",
                showMethod: "slideDown",
                hideMethod: "fadeOut"
            };

            // Show the toaster
            if (showButton == "True") {
                var closeButton = "<br /><br /><button type=\"button\" class=\"btn btn-sm btn-default\">Close</button>";
                eval("toastr." + urgencyClass + "('" + text + closeButton + "', '" + title + "')");
            } else {
                eval("toastr." + urgencyClass + "('" + text + "', '" + title + "')");
            }
        }

    </script>
</head>
<body>
    <form id="form1" runat="server">
        <asp:ScriptManager runat="server"></asp:ScriptManager>
        <br />
        <br />
        <div class="padLeft20">
            <div class="row">
                <div class="col-lg-4">
                    <br />
                    <asp:Button runat="server" ID="cmdGo" Text="Show Toaster" />
                    <asp:UpdatePanel runat="server" ID="upnlSpinner">
                        <ContentTemplate>
                            <asp:LinkButton runat="server" ID="cmdTestSpinner" CssClass="btn btn-sm btn-warning">Test Spinner</asp:LinkButton>
                        </ContentTemplate>
                    </asp:UpdatePanel>
                    <br /><br />
            
                    <!-- Progress Update Panel to show activity spinner -->
                    <asp:UpdateProgress runat="server" ID="updProgess1" AssociatedUpdatePanelID="upnlSpinner">
                        <ProgressTemplate>
                            <div class="sk-spinner sk-spinner-wave">
                                <div class="sk-rect1"></div>
                                <div class="sk-rect2"></div>
                                <div class="sk-rect3"></div>
                                <div class="sk-rect4"></div>
                                <div class="sk-rect5"></div>
                            </div>
                        </ProgressTemplate>
                    </asp:UpdateProgress>
                </div>
            </div>
        </div>
    </form>

    <script src="js/plugins/pace/pace.min.js"></script>

    <script>
        function init() {
        }
    </script>

</body>
</html>

Open in new window

And in the code behind:

Partial Class testParse
    Inherits Page

    Private Sub cmdGo_Click(sender As Object, e As EventArgs) Handles cmdGo.Click

        ScriptManager.RegisterStartupScript(Me, [GetType](), "JSScript", "showToaster('Saved.', 'Room saved.', 'success', 'False', 1000)", True)

    End Sub

    Private Sub cmdTestSpinner_Click(sender As Object, e As EventArgs) Handles cmdTestSpinner.Click

        System.Threading.Thread.Sleep(5000)

    End Sub
End Class

Open in new window

ASKER CERTIFIED SOLUTION

HainKurt

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

BrianFord

ASKER

Hi,

This is not a public page

I don't think it's a missing library as the spinner works fine and the toaster works fine if I simply comment out the lines 70-80 above

The error from Chrome F12 is above, it's the part in italics

HainKurt

Hi Mods,

there is an issue with this Q
I cannot add any comment to this Q and
I am not owner, but I can close this :)

To test, I will close this and give myself some points :)

Please check whats going on with this Q

Thanks...