Object doesn't support property or method 'igGrid

Not Answered This post has 0 verified answers | 4 Replies | 2 Followers Thread's RSS feed.

Infinity
Points 255
Replied On: Thu, Oct 19 2017 12:56 PM Reply
I downloaded igGrid sample code that uses the Northwind database and I'm receiving this error: Line: 29 Error: Object doesn't support property or method 'igGrid'
Here is a partial code snapshot: $("#grid").igGrid({ primaryKey: "ProductID", caption: "<span> <img src=\"//www.infragistics.com/media/441501/horz_logo.png\" alt=\"Infragistics\"></span>", width: '100%', columns: [ { headerText: "Product ID", key: "ProductID", dataType: "number", width: "15%", hidden: true }, { headerText: "Image", key: "ImageUrl", dataType: "string", width: "15%", template: "<img style=\"height:50px;\" src=\"${ImageUrl}\"/>" }, { headerText: "Product Name", key: "ProductName", dataType: "string", width: "25%" }, { headerText: "Category", key: "CategoryName", dataType: "string", width: "25%" }, { headerText: "Units In Stock", key: "InStock", dataType: "number", width: "35%" } ],
Thanks.
 
  • Post Points: 20

All Replies

Replied On: Thu, Oct 19 2017 4:51 PM Reply

Hi Infinity,

Thank you for posting in our forums!

That error occurs if you are not loading the script files for the igGrid correctly.

Are you including the proper script files for the igGrid?  Which files are being included?

If you check your network traffic in your browser's dev tools, do you see any files returning 404 errors?

Looking forward to hearing from you.


Sincerely,

Michael H.

Software Developer
Infragistics, Inc.
http://www.infragistics.com/help

  • Post Points: 20
Infinity
Points 255
Replied On: Fri, Oct 20 2017 10:45 AM Reply

As far as I can tell, I have the correct files. I copied the code from an Infragistics demo. I further checked other demo files

and the code in those files match my code.

 

There was no 404 error.

 Below is the demo code that I am trying to run.

 Any insight into resolving the “Object doesn't support property or method 'igGrid' error is appreciated.

 Thank you.

 

 

<!DOCTYPE html>

<html>

<head>

    <title></title>

 

    <!-- Ignite UI Required Combined CSS Files -->

    <link href="http://cdn-na.infragistics.com/igniteui/2017.1/latest/css/themes/infragistics/infragistics.theme.css" rel="stylesheet" />

    <link href="http://cdn-na.infragistics.com/igniteui/2017.1/latest/css/structure/infragistics.css" rel="stylesheet" />

 

    <script src="http://ajax.aspnetcdn.com/ajax/modernizr/modernizr-2.8.3.js"></script>

    <script src="http://code.jquery.com/jquery-1.11.3.min.js"></script>

    <script src="http://code.jquery.com/ui/1.11.1/jquery-ui.min.js"></script>

 

    <!-- Ignite UI Required Combined JavaScript Files -->

    <script src="http://cdn-na.infragistics.com/igniteui/2017.1/latest/js/infragistics.core.js"></script>

    <script src="http://cdn-na.infragistics.com/igniteui/2017.1/latest/js/infragistics.lob.js"></script>

 

 

</head>

<body>

 

    <table id="grid"></table>

 

    <script src="https://www.igniteui.com/data-files/nw-products.js"></script>

    <script>

        $(function () {

            for (var i = 0; i < northwindProducts.length; i++) {

                northwindProducts[i].ImageUrl = "https://lorempixel.com/50/50/food/" + (i % 10) + "/";

            }

            $("#grid").igGrid({

                primaryKey: "ProductID",

                caption: "<span> <img src=\"//www.infragistics.com/media/441501/horz_logo.png\" alt=\"Infragistics\"></span>",

                width: '100%',

                columns: [

                    { headerText: "Product ID", key: "ProductID", dataType: "number", width: "15%", hidden: true },

                    { headerText: "Image", key: "ImageUrl", dataType: "string", width: "15%", template: "<img style=\"height:50px;\" src=\"${ImageUrl}\"/>" },

                    { headerText: "Product Name", key: "ProductName", dataType: "string", width: "25%" },

                    { headerText: "Category", key: "CategoryName", dataType: "string", width: "25%" },

                    { headerText: "Units In Stock", key: "InStock", dataType: "number", width: "35%" }

                ],

                autofitLastColumn: false,

                autoGenerateColumns: false,

                dataSource: northwindProducts,

                responseDataKey: "results",

                autoCommit: true,

                features: [

                    {

                        name: "Sorting",

                        sortingDialogContainment: "window"

                    },

                    {

                        name: "Filtering",

                        type: "local",

                        columnSettings: [

                            {

                                columnKey: "ImageUrl",

                                allowFiltering: false

                            },

                            {

                                columnKey: "InStock",

                                condition: "greaterThan"

                            }

                        ]

                    },

                    {

                        name: "GroupBy",

                        columnSettings: [

                            {

                                columnKey: "CategoryName",

                                isGroupBy: true

                            }

                        ]

                    },

                    {

                        name: "Selection"

                    },

                    {

                        name: "Paging",

                        pageSize: 10

                    },

                    {

                        name: "Resizing"

                    },

                    {

                        name: "Updating",

                        editMode: "dialog",

                        enableAddRow: false,

                        columnSettings: [

                            {

                                columnKey: "ImageUrl",

                                readOnly: false

                            }

                        ]

                    }

                ]

            });

        });

    </script>

</body>

</html>

 

  • Post Points: 5
Infinity
Points 255
Replied On: Fri, Oct 20 2017 12:51 PM Reply

Inserting the files from page designer solved the problem.

Thank you for your assistance.

  • Post Points: 20
Replied On: Fri, Oct 20 2017 7:03 PM Reply

Hi Infinity,

I suppose it may have been a temporary issue with our CDN serving files since the page designer files should not be required.

I am glad that you were able to get this working though.

If you need anything else, please let me know.


Sincerely,

Michael H.

Software Developer
Infragistics, Inc.
http://www.infragistics.com/help

  • Post Points: 5
Page 1 of 1 (5 items) | RSS