dojo Cannot set property 'id' of undefined

Question

I am making a dynamic GridContainer. However, an error occurred. console.log output a correct value is outputted. However, the execution error. i don't understand this situation.

my code.

  define([ "dojo/parser", "dojo/dom", "dojo/dom-style", 
    "dijit/registry","dojo/on", "dojo/request", "dojo/dom-construct","dojo/json",
    "dojo/_base/array", "dijit/Dialog","dijit/focus" ,"dijit/form/Button","dijit/form/Select","dijit/form/TextBox",
    "dijit/form/CheckBox", "dojo/query","dojox/layout/GridContainer","dojox/widget/Portlet","dijit/layout/BorderContainer",
    "dijit/layout/TabContainer", "dijit/layout/ContentPane"], function(parser, dom, domStyle, 
    registry,on, request, domConstruct,json, arrayUtil, Dialog,focus,Button, CheckBox,query,GridContainer,Portlet) {
function addTab(formCount,num){//make gridContainer ajax
    var xhrArgs = {
                url: '/checkData',
                handleAs: "json",
                content:{
                    seq:num
                },
                load:function(data){
                var cont='';
                   ++gridCounter;
                   cont+='<div dojoType="dojox.layout.GridContainer" class="test" doLayout="true" id="gc'+gridCounter+'" region="center" hasResizableColumns="false" opacity="0.3"  nbZones="1" allowAutoScroll="false" withHandles="true" dragHandleClass="dijitTitlePaneTitle" minChildWidth="200" minColWidth="10" style="height:50%;">';
                   ..........

               }
}
function addGridContainer(id){
        alert('vidgetAddgridNo:'+id);

        var result='';
        var xhrArgs = {
                url: '/checkVidget',
                handleAs: "json",
                content:{
                    id:id
                },
                load: function(data){
                    ++addPorNum;
                    result+=data;
                    var portletContent2 = [
                            domConstruct.create('div', {innerHTML: result})
                    ];
                    var portlet2 = Portlet({
                        id: 'dynPortlet'+addPorNum,
                        closable: false,
                        title: ''+result,
                        content: portletContent2
                    });
                    makeGrid(portlet2);
                }
        }//end xhrArgs
        var deferred = dojo.xhrGet(xhrArgs);
        function makeGrid(por){
            console.log('makeGrid in');
            var selectedTab=registry.byId('tabContainer').get('selectedChildWidget');
            var tabs=registry.byId("tabContainer");
            var cPane=tabs.get("selectedChildWidget");
            var grid=cPane.getChildren()[0];
            var id=grid.id;
            alert(registry.byId(id));=>[Widget dojox.layout.GridContainer,gc1]
            registry.byId(id).addChild(por,0,0);=>Error:Cannot set property 'id' of undefined
        }//end makeGrid()
    }

plz help me..T.T

Answer 1

In your define() module list you defined the following modules:

"dijit/form/Button", "dijit/form/Select", "dijit/form/TextBox",
"dijit/form/CheckBox"

However, in your callback you only have:

Button, CheckBox

So, you're missing the Select and TextBox module here, meaning that the parameter CheckBox actually contains the module dijit/form/Select. Which means every module is shifted and none of them contain the actual value, try fixing that first.