Syncfusion JavaScript grid not displaying. Syntax and Reference error

Question

I have a html page running from a node.js server. I'm trying to use syncfusions basic grid feature and have followed the set up provided http://help.syncfusion.com/web.

My code is as follows:

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
        <meta charset="utf-8" />
        <link href="http://cdn.syncfusion.com/js/web/flat-azure/ej.web.all-latest.min.css" rel="stylesheet" />
        <script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
        <script src="http://cdnjs.cloudflare.com/ajax/libs/jquery-easing/1.3/jquery.easing.min.js"></script>
        <script src="http://ajax.aspnetcdn.com/ajax/globalize/0.1.1/globalize.min.js"></script>
        <script src="http://borismoore.github.io/jsrender/jsrender.min.js"></script>
        <script src="http://cdn.syncfusion.com/js/web/ej.web.all-latest.min.js" type="text/javascript"></script>
        <script type="text/javascript">
            $(function () {
                window.dataManager = ej.DataManager({
                    url: "http://mvc.syncfusion.com/UGService/api/Orders",
                    crossDomain: true,
                    offline:true
                });
                $("#Grid").ejGrid({
                    dataSource: window.dataManager,
                    allowPaging: true,
                    allowFiltering: true,
                    columns: [
                        { field: "Order", headerText: "Order ID", width: 75, textAlign: ej.TextAlign.Right },
                        { field: "CustomerID", headerText: "Customer ID", width: 80 },
                        { field: "ShipName", headerText: "Ship Name", width: 100 },
                        { field: "ShipCity", headerText: "Ship City", width: 100 },
                        { field: "Freight", width: 80, format: "{0:C3}", textAlign: ej.TextAlign.Right }
                    ]
                });
            });
        </script>
    </head>
    <body>
        <div id="Grid"></div>
    </body>
</html>

<body>
<div id="Grid"></div>
</body>
</html>

I have just copied and pasted it and tried to run it but got the error

ej.web.all-latest.min.js:1 Uncaught SyntaxError: Unexpected token ILLEGAL test.html:27 Uncaught ReferenceError: ej is not defined

I've included their js file for ej. The first error is line 1 of this file http://cdn.syncfusion.com/js/web/ej.web.all-latest.min.js

What is happening? I can't figure it out :/ Any help would be great as today is the first day I've started to use syncfusion and there is not really much documentation to help you set it up...

score 3 · Accepted Answer · edited Mar 12 '15 at 05:52

3

The reported issue in cdn link of ej.web.all-latest.min.js was now fixed. Now you can use the same cdn link in your sample.

Regards,

Sunil Prabakar [Syncfusion Team]

edited Mar 12 '15 at 05:52

YogeshWaran

2,291
4
24
32

answered Mar 12 '15 at 04:55

Sunil Prabakar

442
1
5
19

score 2 · Answer 2 · answered Mar 10 '15 at 16:06

http://cdn.syncfusion.com/js/web/ej.web.all-latest.min.js is a gzipped resource without the HTTP headers that would explain that to the browser so it would decompress it for you.

In short, the hosted version of that file is broken. Find a clean version from else where (or download it with wget and manually gunzip it) and host it somewhere else.

Syncfusion JavaScript grid not displaying. Syntax and Reference error

2 Answers2