Threaded View

  1. #1
    Sencha User
    Join Date
    Jun 2011
    Location
    Bangalore, India
    Posts
    176
    Answers
    4
    Vote Rating
    2
    renganathan is on a distinguished road

      0  

    Default Answered: 'xtype' is null or not an object error in IE 8

    Answered: 'xtype' is null or not an object error in IE 8


    Hi everyone ,

    i am getting xtype is null or not an object error in internet explorer 8 . i have share my code here
    Code:
    Ext.Loader.setConfig({enabled: true});
    Ext.Loader.setPath('Ext.ux', '../../extjs/examples/ux');
    Ext.require([
         'Ext.grid.*',
         'Ext.data.*',
         'Ext.ux.grid.FiltersFeature',
        'Ext.selection.CellModel',
         'Ext.util.*',
        'Ext.state.*',
        'Ext.form.*',
        'Ext.ux.CheckColumn'
    ]);
    Ext.QuickTips.init();
    
    var defaultlab = '';
    Ext.onReady(function()
    {
        Ext.QuickTips.init();
        Ext.data.Connection.disableCaching = true;
    
        var searchString = new Ext.form.field.Text
        (
            {                
                id          : 'searchString',
                name        : 'searchString',
                width        : 150
            }
        );
    
        // The data store containing the list of states
        var states = Ext.create('Ext.data.Store', 
        {
            fields            : ['city_name'],
    
            proxy            : 
            {
                type        : 'ajax',
                url            : '../src/profile_labs.class.php?action=getcity',
                reader        : 
                {
                    type    :'json',
                    root    : 'city_name'
                }
            },
             autoLoad: true
        });
        var CheckboxValuesField = new Ext.form.TextField(
            {
                name:'checkbox_values',
                fieldLabel: 'Checkbox values',
                allowBlank: false,
                anchor:'95%',
                hidden : true
            });
        
    
        
            
            var CheckboxValuesField2 = new Ext.form.TextField(
                    {
                        name        :'CheckboxValuesField2',
                        fieldLabel    : 'Checkbox values',
                        allowBlank    : false,
                        anchor        : '95%',
                        hidden        : true
                    });
                    
                    
                    
        var DeviceCheckboxValuesField = new Ext.form.TextField(
                {
                    name:'checkbox_values',
                    fieldLabel: 'Checkbox values',
                    allowBlank: false,
                    anchor:'95%',
                    hidden : true
                });
        // Create the combo box, attached to the states data store
        var examples = new Ext.form.ComboBox( 
        {
            store            : states,
            displayField    : 'city_name',
            valueField        : 'city_name',
            
            listeners : 
            {
                'change': 
                {
                    fn: function() 
                    {
                        
                        
                        searchString.setValue("");
                    
                    }
                }
            
            }
            
        });
    
        var searchform = new Ext.form.FormPanel(
        {
            width        : 850,
            height        : 40,
            border        : false,
            margin        : '10 0 0 0',
            layout        : 
            { 
                type    : 'hbox'
              
            }, 
             items        : 
             [
                {
                    xtype        : 'label', 
                    margins        : '0 15 0 10', 
                    text        : 'Lab name :' 
                },
                searchString,
                {
                    xtype        : 'label', 
                    margins        : '0 15 0 10', 
                    text        : 'Choose city :' 
                },
                examples,
                {
                    xtype       : 'button',
                    text        : 'Go',
                    margins        : '0 0 0 10', 
                    width        : 30,
                    handler        : function ()
                    {        
                        Ext.getCmp('firstGrid').getStore().load(
                        {
                            params: 
                            {
                                city        : examples.getValue(),
                                searchString: searchString.getValue(),
                                action        : 'searchLab'
                            }
                        });
                    }
                }
             ]
        });
        
        Ext.define('DataObject', 
        {
            extend: 'Ext.data.Model',
            fields: ['spname',  'city_name', 'ulid']
        });
        
        
        
            var firstGridModel = new Ext.selection.CheckboxModel( 
        {
            listeners        :
            {
                checkOnly    : true,
                selectionchange: function(model, record, options)
                {   
                    if (model.getCount()) 
                    {
                        
                        var CheckedNumDevice = record.length;
                                var CheckedValuesDevice = "";
                                for(var a=0;a<CheckedNumDevice;a++) 
                                {
                                    CheckedValuesDevice += record[a].get('spname')+":"+record[a].get('city_name')+":"+record[a].get('ulid')+",";
                                }
                                Ext.getCmp('DeviceCheckboxValuesField').setValue(CheckedValuesDevice.slice(0, -1));
                        
                        
                        //selectedRowIndx = Ext.getCmp('secondGrid').getStore().indexOf(record[0]);
                        //defaultlab = record[0].get('ulid');
                        
                    } else 
                    {
                        // Ext.getCmp('favoriteModifyButton').disable();
                        // Ext.getCmp('favoriteDeleteButton').disable();
                        // Ext.getCmp('favoriteExecuteButton').disable();
                    }
                }
            },
            
            tbar:[
                    CheckboxValuesField
                ]
        });
        
        
        
        
        var secondGridModel = new Ext.selection.CheckboxModel( 
        {
            
            allowBlank        : false,
            listeners        :
            {
                checkOnly    : true,
                selectionchange: function(model, record, options)
                {   
                    if (model.getCount()) 
                    {
                        // //selectedRowIndx = Ext.getCmp('secondGrid').getStore().indexOf(record[0]);
                        // defaultlab = record[0].get('ulid');
                        
                        var CheckedNum = record.length;
                                    var CheckedValues = "";
                                    for(var a=0;a<CheckedNum;a++)
                                    {
                                        CheckedValues += record[a].get('ulid')+",";
                                    }
                                    CheckboxValuesField2.setValue(CheckedValues.slice(0, -1));
                        
                        
                    } else 
                    {
                        // Ext.getCmp('favoriteModifyButton').disable();
                        // Ext.getCmp('favoriteDeleteButton').disable();
                        // Ext.getCmp('favoriteExecuteButton').disable();
                    }
                }
            },
            
            tbar:[
                CheckboxValuesField2
                 ]    
        });
        
        
        
        
        var firstGridStore = Ext.create('Ext.data.Store', 
        {
            autoLoad            : true,
            loadmask            : false,
            fields                : ['spname', 'city_name', 'ulid'],
            model                : 'DataObject',
            proxy                : 
            {
                type            : 'ajax',
                url                : '../src/profile_labs.class.php?action=searchLab',
                actionMethods: { create: 'POST', destroy: 'DELETE', read: 'POST', update: 'POST'}, 
                extraParams        : 
                {
                  city            : examples.getValue(),
                  searchString    :searchString.getValue(),
                  action        :'searchLab'
                },
                reader: 
                {
                    type        :'json',
                    root        : 'myData'
                }
            }
        });
        
    
            var columns1 = 
        [
            {text: "Lab Name", flex: 1, sortable: true, dataIndex: 'spname'},
            
            {text: "City Name", width: 100, sortable: true, dataIndex: 'city_name'}
        ];
        
        
        
        // Column Model shortcut array
        var columns2 = 
        [
            {text: "Lab Name", flex: 1, sortable: true, dataIndex: 'spname'
            // ,renderer:function test(v, p, record, rowIndex){
                                
                                // record_testbed_id = record.get('ulid');
                                // if( PrimaryLab ==record_testbed_id)
                                // {
                                    // secondGridModel.select(rowIndex,true);
                                // }
                                // return v;
                            // }
            },
            
            {text: "City Name", width: 100, sortable: true, dataIndex: 'city_name'},
            {text: "Default Lab" ,  
            
                renderer: function change(v, p, record, rowIndex) 
                {
                    if(PrimaryLab == record.get('ulid'))
                        {
                        return '<input type="radio" name="rd" value="'+record.get('ulid')+'" checked = "checked"   />';
                        }
                    else{
                        
                        return '<input type="radio" name="rd" value="'+record.get('ulid')+'"   />';
                        
                        }
                        
                        
                }
               
            }
        ];
    
        
    var encode = false;
    var local = true;
    var myFilters = 
                    {
                        ftype                   : 'filters',
                        encode                     : false,
                        local                   : false,
                        autoReload                 : true,
                        filters: 
                        [
                            {
                                type                : 'string',
                                dataIndex           : 'spname'
                            },
                            {
                                type                : 'string',
                                dataIndex           : 'city_name'
                            }
                        ]
                    };
        
        
        
        
        // declare the source Grid
        var firstGrid = Ext.create('Ext.grid.Panel', 
        {
            width                : 400,
            height                : 300,
           multiSelect            : true,
            id                    : 'firstGrid',
            features            : [ myFilters],
            selModel            : firstGridModel,
            viewConfig            : 
            {
               
                listeners        : 
                {
                    
                }
            },
            store            : firstGridStore,
            columns          : columns1,
            stripeRows       : true,
            margins          : '0 2 0 0',
            title            : 'Search Result'
        });
        
        
                    var addDeviceBtn =  new Ext.Button(
                        {
                            text    : '=>',
                            handler    : function(){
                                
                                        rowsSelected = firstGrid.getSelectionModel().getSelection();
                                        var store = Ext.getCmp('secondGrid').getStore();
                                        
                                         function addRow(record, index, allItems) {
                    
                                             var foundItem = store.findExact('ulid', record.data.ulid);
                                             
                                             if (foundItem  == -1) {
                                                 store.add(record);
                                             }
                                             else{
                                                // Ext.MessageBox.alert('Error!', record.data.ulid+' lab already added');
                                             }
                                         }
                                             
                                         Ext.each(rowsSelected,addRow);
                            },
                            tooltip    :'Select Lab'
                        }); 
                
                var removeDeviceBtn =  new Ext.Button(
                        {
                            text    : '<=',
                            handler    : function() {
                                                    rowsSelected = secondGrid.getSelectionModel().getSelection();
                                                    var store = Ext.getCmp('secondGrid').getStore();
                                                    store.remove(rowsSelected);
                            },
                            tooltip    :'Remove Lab'
                        });
            
     var centerPanel = Ext.create('Ext.Panel', {
                    width        : 40,
                    height        : 300,
                    // forceFit    : true,
                     margins        : '120 0 0 0',
                    layout        : {
                                    type: 'vbox',
                                    padding : 5
                    },
                    border        : false,
                    items        : [
                                    addDeviceBtn,
                                    removeDeviceBtn
                    ]
    
                });
        var secondGridStore = Ext.create('Ext.data.Store', 
        {
            autoLoad            : true,
            id                    : 'secondGridStore',
            loadmask            : false,
            fields                : ['spname', 'city_name', 'ulid'],
            proxy                : 
            {
                type            : 'ajax',
                url                : '../src/profile_user.class.php',
                actionMethods: { create: 'POST', destroy: 'DELETE', read: 'POST', update: 'POST'}, 
                extraParams        :
                {
                    action        : 'getUserLabDetails'
                },
                reader            : 
                {
                    type        :'json'
                }
            }
        });
                
        // create the destination Grid
        var secondGrid = Ext.create('Ext.grid.Panel', 
        {
            width                : 400,
            height                : 300,
            id                    : 'secondGrid',
            multiSelect            : true,
            selModel            : secondGridModel,
            features            : [ myFilters],
            viewConfig            : 
            {
                
                listeners        : 
                {
                
    
    
                }
            },
            store                : secondGridStore,
            columns              : columns2,
            stripeRows           : true,
            // margins              : '0 0 0 3',
            title                : 'Selected Labs'
        });
        
        //Simple 'border layout' panel to house both grids
        var dndPanel = Ext.create('Ext.Panel', 
        {
             //autowidth            : true,
            width                : 850,
            height               : 300,
            layout               : 
            {
                type            : 'hbox'
               
            },
           
            items                : 
            [
                
                firstGrid,
                centerPanel,
                secondGrid
            ],
            buttons     :
            [
                {
                    text            : 'Save',
                    descriptionText : 'Save',
                    handler         : function()
                    {
                        
                        
                        var selrad = document.getElementsByName("rd");
                        var srlen = selrad.length;
                        
                        for(x=0; x<srlen; x++)
                            {
                            
                            if(document.getElementsByName("rd")[x].checked)
                                {
                                
                                defaultlab = document.getElementsByName("rd")[x].value
                                }
                            
                            }
                            
                        if(srlen != 0)
                        {
                        //alert(defaultlab);
                         if(defaultlab != '' )
                         {
                        var gridSecondStore = Ext.getCmp('secondGrid').getStore();
                        //console.log(gridSecondStore);
                        var selected_count = gridSecondStore.getCount();
                        var i ;
                        var sellabrefid = "";
                        for(i=0; i<selected_count; i++)
                        {
                            //---commented on 19-09-2011
                            //sellabrefid += "'"+gridSecondStore.data.items[i].data.ulid+"'"+",";
                            sellabrefid += gridSecondStore.data.items[i].data.ulid+",";
                            var strLen = sellabrefid.length;
                            var    myStr = sellabrefid.slice(0,strLen-1);
                        }
                        var URLProfile = '../src/profile_user.class.php';
                        Ext.Ajax.request(
                        {   
                            waitMsg: 'Please wait...',
                            url: URLProfile,
                            params: { action:'setProfile', selectedlab:myStr, defaultlab:defaultlab }, 
                            success: function(response)
                            {              
                                  var resultDevice= eval('(' + response.responseText + ')');
                                  if(resultDevice == 1) 
                                {
                                Ext.MessageBox.alert('Success!','Profile Saved Successfully!');
                                window.close();
                                parent.location.reload();
    
                                }
                            
                            },
                            failure: function(response)
                            {
                                  var resultDevice=response.responseText;
                                  Ext.MessageBox.alert('error','Could not connect to the database.Please try later!');         
                            }                      
                          });
                        
                        }
                        else
                        {
                        Ext.MessageBox.alert('error','Please select default lab');  
                        }
                        }
                        else
                        {
                            Ext.MessageBox.alert('error','Please select atleast one lab to save'); 
                        
                        }
                    }
                },
            ]
        });
    
        var displayPanel = Ext.create('Ext.Panel', 
        {    
             autowidth                : true,
             height                    : 400,
            forceFit                : true,
            renderTo                : Ext.getBody(),
            layout               : 
            {
                type            : 'vbox'
               
            },
            items                : 
            [
                searchform,
                dndPanel
            ]
        });
        
                
        examples.setValue(myCity);
        
    });

    Can you guys help me to fix the problem ?
    Thanks,

    RENGANATHAN M G

  2. That is far too much code. Please reduce your code down to a minimal test case before posting.

    I would guess the problem is the stray comma at the end of your buttons array:

    Code:
    buttons     :
    [
        {
            text            : 'Save',
            ...
        },
    ]
    Whatever IDE you're using should pick this up automatically. If not you should use JSLint to check your code (or get a better IDE).

Thread Participants: 1

Tags for this Thread