Samyx 36 Junior Poster in Training

My code is working for the Agents, Labs and Investigator's grid, but when I add the last grid 'Vaccines', the grid does not display. According to firebug there is a "TypeError:W.localdata is undefined"
It seems to be a problem with my orders3 data, but I can't figure out what.

Can anyone help me?

<!DOCTYPE html>
<html lang="en">
<body>

        <script type="text/javascript">
            $(document).ready(function () {

                //var url = "../agents.txt";
                var data1,data2,data3,data4,data5;
                $.getJSON("newdata3.php?level=1", function(json){
                    data1 =json;
                })

                .success(function() { 
                    $.getJSON("newdata3.php?level=2", function(json){
                        data2 =json;
                    })

                    .success(function() { 
                        $.getJSON("newdata3.php?level=3", function(json){
                            data3 =json;
                        });
                        $.getJSON("newdata3.php?level=4", function(json){
                            data4 =json;
                        });
                        $.getJSON("newdata3.php?level=5", function(json){
                            data5=json;
                        })

                        .success(function() { 
                            $('#load').hide();
                            var source =
                            {
                                datafields: [
                                { name: 'AgentName' },
                                { name: 'StudyName' },
                                { name: 'INDno' },
                                { name: 'Sponsor' },
                                { name: 'StudyStatus' }
                                ],
                                id:'StudyName',
                                record:'StudyName',
                                localdata:data1
                            };

                            var employeesAdapter = new $.jqx.dataAdapter(source);

                            var ordersSource =
                            {
                                datafields: [
                                { name: 'StudyName', type: 'string' },
                                { name: 'SiteName', type: 'string' },
                                { name: 'PIName', type: 'string' },
                                { name: 'SiteStatus', type: 'string' },
                                { name: 'IRBappcr', type: 'string' },
                                { name: 'Ohrp', type: 'string' },
                                { name: 'Ib', type: 'string' },
                                { name: 'Prot', type: 'string' },
                                { name: 'Ic', type: 'string' },
                                { name: 'Global1572', type: 'string' },
                                { name: '1572', type: 'string' },
                                { name: 'amtrackid', type: 'string' }
                                ],  
                                id:'amtrackid',                                 
                                record:'amtrackid',
                                localdata:data2
                            };

                            var ordersDataAdapter = new $.jqx.dataAdapter(ordersSource, { autoBind: true });
                            orders = ordersDataAdapter.records;
                            var nestedGrids = new Array();

                            var ordersSource1 =
                            {
                                datafields: [
                                { name: 'LabId', type: 'integer' },
                                { name: 'amtrackid', type: 'string' },
                                { name: 'Name', type: 'string' },
                                { name: 'Cap', type: 'integer' },
                                { name: 'Clia', type: 'integer' },
                                { name: 'LNV', type: 'integer' }
                                ],  
                                id:'amtrackid', 
                                record:'amtrackid',
                                localdata:data3
                            };

                            var ordersDataAdapter1 = new $.jqx.dataAdapter(ordersSource1, { autoBind: true });
                            orders1 = ordersDataAdapter1.records;
                            var nestedGrids1 = new Array();


                            var ordersSource2 =
                            {
                                datafields: [
                                { name: 'PersonId', type: 'integer' },
                                { name: 'amtrackid', type: 'string' },
                                { name: 'Name', type: 'string' },
                                { name: 'CV', type: 'integer' },
                                { name: 'ML', type: 'integer' },
                                { name: 'FD', type: 'integer' },
                                { name: 'HSPT', type: 'integer' },
                                { name: 'DOT', type: 'integer' },
                                { name: 'PISORT', type: 'integer' }
                                ],  
                                id:'amtrackid', 
                                record:'amtrackid',
                                localdata:data4
                            };

                            var ordersDataAdapter2 = new $.jqx.dataAdapter(ordersSource2, { autoBind: true });
                            orders2 = ordersDataAdapter2.records;
                            var nestedGrids2 = new Array();

                            var ordersSource3 =
                            {
                                datafields: [
                                { name: 'amtrackid', type: 'string' },
                                { name: 'Ibc', type: 'integer' },
                                { name: 'Obarac', type: 'integer' }
                                ],  
                                id:'amtrackid', 
                                record:'amtrackid',
                                localdata:data5
                            };

                            var ordersDataAdapter3 = new $.jqx.dataAdapter(ordersSource3, { autoBind: true });
                            orders3 = ordersDataAdapter3.records;
                            var nestedGrids3 = new Array();

                            // create nested grid.
                            var initrowdetails1 = function (index, parentElement, gridElement, record) {
                                var id = record.amtrackid.toString();
                                grid = $($(parentElement).children()[0]);
                                nestedGrids1[index] = grid;
                                grid1= $($(parentElement).children()[1]);
                                nestedGrids2[index] = grid1;
                                grid2= $($(parentElement).children()[2]);
                                nestedGrids3[index] = grid2;
                                var filtergroup = new $.jqx.filter();
                                var filter_or_operator = 1;
                                var filtervalue = id;
                                var filtercondition = 'equal';
                                var filter = filtergroup.createfilter('stringfilter', filtervalue, filtercondition);
                                // fill the orders depending on the id.
                                var ordersbyid1 = [];
                                var ordersbyid2 = [];
                                var ordersbyid3 = [];
                                for (var m = 0; m < orders1.length; m++) {
                                    var result = filter.evaluate(orders1[m]["amtrackid"]);
                                    if (result)
                                    ordersbyid1.push(orders1[m]);
                                };
                                for (var m = 0; m < orders2.length; m++) {
                                    var result = filter.evaluate(orders2[m]["amtrackid"]);
                                    if (result)
                                    ordersbyid2.push(orders2[m]);
                                };
                                for (var m = 0; m < orders3.length; m++) {
                                    var result = filter.evaluate(orders3[m]["amtrackid"]);
                                    if (result)
                                    ordersbyid3.push(orders3[m]);
                                }

                                var orderssource1 = { datafields: [
                                    { name: 'LabId', type: 'integer' },
                                    { name: 'Name', type: 'string' },
                                    { name: 'Cap', type: 'integer' },
                                    { name: 'Clia', type: 'integer' },
                                    { name: 'LNV', type: 'integer' }
                                    ],
                                    id: 'LabId',
                                    record: 'LabId',
                                    localdata: ordersbyid1
                                }
                                var orderssource2 = { datafields: [
                                    { name: 'PersonId', type: 'integer' },
                                    { name: 'Name', type: 'string' },
                                    { name: 'CV', type: 'integer' },
                                    { name: 'ML', type: 'integer' },
                                    { name: 'FD', type: 'integer' },
                                    { name: 'HSPT', type: 'integer' },
                                    { name: 'DOT', type: 'integer' },
                                    { name: 'PISORT', type: 'integer' }
                                    ],
                                    id: 'PersonID',
                                    record: 'PersonID',
                                    localdata: ordersbyid2
                                }
                                var orderssource3 = { datafields: [
                                    { name: 'amtrackid', type: 'string' },
                                    { name: 'Ibc', type: 'integer' },
                                    { name: 'Obarac', type: 'integer' }
                                    ],
                                    id: 'amtrackid',
                                    record: 'amtrackid',
                                    localdata: ordersbyid3
                                }

                                var nestedGridAdapter1 = new $.jqx.dataAdapter(orderssource1);
                                var nestedGridAdapter2 = new $.jqx.dataAdapter(orderssource2);
                                var nestedGridAdapter3 = new $.jqx.dataAdapter(orderssource3);

                                if (grid != null) {
                                    grid.jqxGrid({
                                        source: nestedGridAdapter1, theme: 'fresh', autoheight: true, width: '100%', 
                                        columns: [
                                        //{ text: '<b>Lab ID</b>', datafield: 'LabId', width: '10%' },
                                        { text: '<b>Lab</b>', datafield: 'Name', width: '50%' },
                                        { text: '<b>CAP</b>', datafield: 'Cap', width: '17%' },
                                        { text: '<b>CLIA</b>', datafield: 'Clia', width: '17%' },
                                        { text: '<b>LNV</b>', datafield: 'LNV', width: '16%' }
                                        ]
                                    });
                                    grid1.jqxGrid({
                                        source: nestedGridAdapter2, theme: 'fresh', autoheight: true,width: '100%', 
                                        columns: [
                                        //{ text: '<b>Person ID</b>', datafield: 'PersonId', width: '10%' },
                                        { text: '<b>Investigator</b>', datafield: 'Name', width: '35%' },
                                        { text: '<b>CV</b>', datafield: 'CV', width: '13%' },
                                        { text: '<b>FD</b>', datafield: 'FD', width: '13%' },
                                        { text: '<b>ML</b>', datafield: 'ML', width: '13%' },
                                        { text: '<b>HSPT</b>', datafield: 'HSPT', width: '13%' },
                                        { text: '<b>DOT</b>', datafield: 'DOT', width: '13%' }
                                        //{ text: '<b>PISORT</b>', datafield: 'PISORT', width: '10%' }
                                        ]
                                    });
                                    grid2.jqxGrid({
                                        source: nestedGridAdapter3, theme: 'fresh', autoheight: true,width: '100%', 
                                        columns: [
                                        { text: '<b>AmtrackID</b>', datafield: 'amtrackid', width: '10%' },
                                        { text: '<b>IBC</b>', datafield: 'Ibc', width: '45%' },
                                        { text: '<b>OBARAC</b>', datafield: 'Obarac', width: '45%' }
                                        ]
                                    });
                                }
                            };
                            //////////////////////////////////////


                            // create nested grid.
                            var initrowdetails = function (index, parentElement, gridElement, record) {
                                var id = record.uid.toString();
                                var grid = $($(parentElement).children()[0]);
                                nestedGrids[index] = grid;
                                var filtergroup = new $.jqx.filter();
                                var filter_or_operator = 1;
                                var filtervalue = id;
                                var filtercondition = 'equal';
                                var filter = filtergroup.createfilter('stringfilter', filtervalue, filtercondition);
                                // fill the orders depending on the id.
                                var ordersbyid = [];
                                for (var m = 0; m < orders.length; m++) {
                                    var result = filter.evaluate(orders[m]["StudyName"]);
                                    if (result)
                                    ordersbyid.push(orders[m]);
                                }

                                var orderssource = { datafields: [
                                    { name: 'StudyName', type: 'string' },
                                    { name: 'SiteName', type: 'string' },
                                    { name: 'PIName', type: 'string' },
                                    { name: 'SiteStatus', type: 'string' },
                                    { name: 'IRBappcr', type: 'string' },
                                    { name: 'Ib', type: 'string' },
                                    { name: 'Ohrp', type: 'string' },
                                    { name: 'Prot', type: 'string' },
                                    { name: 'Ic', type: 'string' },
                                    { name: 'Global1572', type: 'string' },
                                    { name: '1572', type: 'string' },
                                    { name: 'amtrackid', type: 'integer'}                                   

                                    ],
                                    id: 'StudyName',
                                    localdata: ordersbyid
                                }

                                var nestedGridAdapter = new $.jqx.dataAdapter(orderssource);

                                if (grid != null) {
                                    grid.jqxGrid({ height: 500,rowdetails: true, theme: 'fresh', initrowdetails: initrowdetails1, source: nestedGridAdapter, width: '100%', 
                                        rowdetailstemplate: { rowdetailsheight: 600, rowdetails: "<div id='subgrid" + i + "' '></div><div id='subgridd" + i + "' '></div><div id='subgriddd" + i + "' '></div>", rowdetailshidden: true },

                                        columns: [
                                        { text: '<b>Site</b>', datafield: 'SiteName', width: '20%' },
                                        { text: '<b>PI</b>', datafield: 'PIName', width: '20%' },
                                        { text: '<b>Site Status</b>', datafield: 'SiteStatus', width: '11%' },
                                        { text: '<b>IRB APPCR</b>', datafield: 'IRBappcr', width: '7%' },
                                        { text: '<b>OHRP</b>', datafield: 'Ohrp', width: '7%' },
                                        { text: '<b>IB</b>', datafield: 'Ib', width: '7%' },
                                        { text: '<b>PROT</b>', datafield: 'Prot', width: '7%' },
                                        { text: '<b>IC</b>', datafield: 'Ic', width: '7%' },
                                        { text: '<b>Global1572</b>', datafield: 'Global1572', width: '7%' },
                                        { text: '<b>1572</b>', datafield: '1572', width: '7%' },

                                        ]
                                    });
                                }
                            };
                            ///////////////////////////

                            var renderer = function (row, column, value) {
                                return '<span style="margin-left: 4px; margin-top: 9px; float: left;">' + value + '</span>';
                            }

                            // create jqxgrid
                            $("#jqxgrid").jqxGrid(
                            {
                                width: '90%',
                                autoheight: true,
                                //height: '100%',
                                source: source,
                                rowdetails: true,
                                theme:'fresh',
                                initrowdetails: initrowdetails,
                                rowdetailstemplate: { rowdetailsheight: 300, rowdetails: "<div id='grid'></div>", rowdetailshidden: true },
                                //ready: function () {
                                //  $("#jqxgrid").jqxGrid('showrowdetails', 0);
                                //},
                                columns: [
                                { text: '<b>Agent Name</b>', datafield: 'AgentName', width: '30%', cellsrenderer: renderer },
                                { text: '<b>Study</b>', datafield: 'StudyName', width: '30%', cellsrenderer: renderer },
                                { text: '<b>IND No.</b>', datafield: 'INDno', width: '10%', cellsrenderer: renderer },
                                { text: '<b>Sponsor</b>', datafield: 'Sponsor', width: '10%', cellsrenderer: renderer },
                                { text: '<b>Current Status</b>', datafield: 'StudyStatus', width: '20%', cellsrenderer: renderer }
                                ]
                            });
                        });
                    });
                    });
                    });


<body class='default'><center><table style= "width: 100%;">
<div  id="jqxgrid">
</div></table></center>
<img id="load" src="loading.gif" alt="Smiley face" height="250px" width="400px">     

</body>              
</html>                  
Be a part of the DaniWeb community

We're a friendly, industry-focused community of 1.21 million developers, IT pros, digital marketers, and technology enthusiasts learning and sharing knowledge.