I finally go it.

rather than :  CabinetList = { "Records": [data.d] };

I did this: var obj = jQuery.parseJSON(data.d);

then i set: dataSource: obj,

thank you for all your help.

j

I'm still not seeing data in the grid. Very odd. I do know that if i set the json data to a session object and then bind that to the grid it works, but that's the only way i can get it to work. Odd that when i run this i get no data but i can see the data when I write it out to the page in an alert or using document.write but nothing shows in the grid.

here is my data

[{"cabinetid":"9921acb6-b0c0-42aa-843d-00355a66c1fc","title":"EC02A","datecreated":null,"isenabled":null},{"cabinetid":"b269aea3-b5c5-45c0-a805-008ca2d41208","title":"AE38D","datecreated":null,"isenabled":null},{"cabinetid":"e7c1b7c8-6ef8-4340-bcec-00a3a70f78b3","title":"BDD1A","datecreated":null,"isenabled":null},{"cabinetid":"ca6e2ab0-214b-41a2-a322-031fa4e768c1","title":"06616","datecreated":null,"isenabled":null}]

here is the code thus far (and i did add that js file)

$.ig.loader({

            scriptPath:

"../../js/",

            cssPath:

"../../css/",

            resources:

"igGrid.Paging,igGrid.Sorting,igGrid.Filtering"

        });

        $(document).ready(

function () {

            GetCabinets();

        });

var url = "../../../../Inventory.asmx/getCabinets3";

var dataParams = '';

function GetCabinets() {

            $.ajax({

                type: "POST",

                url: url,

                async: false,

                data: '{' + dataParams + '}',

                contentType: "application/json; charset=utf-8",

                dataType: "json",

                success:

function (data) {

                    CabinetList = {"Records": [data.d] };

//alert([data.d]);

// document.write([data.d]);

                    $(

function () {

                       //alert([data.d]);

                        $(

"#grid1").igGrid({

                            columns: [{

                                headerText: "Cabinet ID",

                                key: "cabinetid",

                                dataType: "string"

                            },

                            {

                                headerText: "Title",

                                key: "title",

                                dataType: "string"

                            }],

                            features: [

                                     {

                                         name: 'Paging',

                                         pageSize: 20

                                     },

                                     {

                                         name: 'Sorting'

                                     },

                                     {

                                         name: 'Filtering',

                                         filterDropDownItemIcons: false,

                                         filterDropDownWidth: 200

                                     }

                                 ],

                            autoGenerateColumns: false,

                           //responseDataKey: "Records",

                            dataSource: [data.d],

                            dataType: "json",

                            height: 300

                        });

//alert([data.d]);

                    });

                },

                error:

function (xhr, ajaxOptions, thrownError) {

                    alert(xhr.responseText);

                    alert(thrownError);

                }

            });

        }

<table id="grid1"></table>

Hi Jason

I've been using the full versions of infragistics for many years so don't have a lot of experience with the trial version but I do know it should be the same. So I downloaded and installed on a spare machine. I see the references are the same and testing it does produce the right result.

In the scenario I've given you, the reference to infragistics.js is needed. This should be in the same folder where the infragistics.loader.js

change this to infragistics.js

<script src="../../js/infragistics.loader.js" type="text/javascript"></script>

If it's missing or you need to get it you can find it in the install folder, usually, C:\Program Files (x86)\Infragistics\IgniteUI 2012.2 under the js sub folder.

The reference to demo.js is not necessary unless it's your own file.

Order is also NB!!, but it looks like you got them right.

I also made a typo in the sample. This  primaryKey:"primaryid" should be  primaryKey:"cabinetid"

Let me know how you get along.

Wayne

Wayne thank you very much for the assistance. I tried your code and get this error: "Microsoft JScript runtime error: Object doesn't support property or method 'igGrid'"

I should specify that this is the latest "trial version". The javascript files I'm using are:

<script src="../scripts/modernizr.min.js"></script>

<script src="../scripts/jquery.min.js"></script>

<script src="../scripts/jquery-ui.min.js"></script>

<script src="../scripts/demos.js" type="text/javascript"></script>

<script src="../../js/infragistics.loader.js" type="text/javascript"></script>

I noticed they are different than the ones you are using. Not sure if that is the reason for the error.

jason

Hi JsonTerre

I don't use the loader functions as I need most of the ig controls when I'm using the grids and am too lazy to decide upfront what I need.

Here is a sample implementation without the loader. Get it working this way first and then add the loaders.

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<script src="js/jquery.js" type="text/javascript"></script>

<script src="js/jquery-ui.js" type="text/javascript"></script>

<script src="js/infragistics.js" type="text/javascript"></script>

<link href="css/themes/infragistics/infragistics.theme.css" rel="stylesheet" type="text/css" />

<link href="css/structure/infragistics.css" rel="stylesheet" type="text/css" />

   <script type="text/javascript">

        GetItems();

       var yourUrl ="../../../../Inventory.asmx/getCabinets3";

function GetItems() {

            $.ajax({

                type:"POST",

                url:  yourUrl,

                data:"{}",

                contentType:"application/json; charset=utf-8",

                dataType:"json",

                success:

function (response) {

                    records = response.d;

  if ($("#grid").data("igGrid") === undefined) {

                        $("#grid").igGrid({

                            autoGenerateColumns:false,

                            primaryKey:"primaryid",

                            columns: [

                 { headerText:"ID", key: "cabinetid", dataType: "number", width: "22em" },

                          { headerText:"Title", key: "title", dataType: "string", width: "41em" }     

                       ],

                            dataSource: records,

                            height:'38em',

                            width:'72.6em',

                            features: [{

                               name:"Selection",

                                mode:"row"

                            },

  {

                         name: 'Paging',

                         pageSize: 20

                     },

                    {

                        name: 'Sorting'

                     },

                    {

                        name: 'Filtering',

                         filterDropDownItemIcons: false,

                         filterDropDownWidth: 200

                     }

                            ]

                        });

                    }

                },

                failure:

function (msg) {

                    alert(msg);

                }

            });

        }

 </script>

</head>

<body>

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

</body>

</html>

Hope this helps

Wayne