Jack Mans
Jack Mans

Reputation: 23

Creating Dojo Memory causes Uncaught TypeError: Cannot read property 'style' of null

I am trying to create a simple worklight application, but trying to create a new Memory causes an: Uncaught TypeError: Cannot read property 'style' of null at mobile-ui-layer.js:378

Which seems quite odd since I don't get what creating a Memory object has to do with styling.

When debugging in Chrome I get it immediately after the var testStore = new Memory({data:storeData}) line .

require (
                    ["dojo", 
                    "dojo/parser", 
                    "dojo/_base/xhr",
                    "dijit/form/ComboBox",  
                    "dojo/store/JsonRest", 
                    "dojo/ready",
                    "dojox/mobile/EdgeToEdgeStoreList",
                    "dojox/mobile",
                    "dojox/mobile/parser",
                    "dojox/io/xhrWindowNamePlugin",
                    "dojox/io/windowName", 
                    "dojox/io/xhrPlugins", 
                    "dojo/dom-style", 
                    "dojo/dom", 
                    "dojo/dom-class", 
                    "dojo/_base/Deferred",
                    "dojo/store/Memory"], function(JsonRestStore, EdgeToEdgeStoreList, xhrPlugins, Memory) {

            storeData = [
                                 { "label": "Wi-Fi", "icon": "images/i-icon-3.png", "rightText": "Off", "moveTo": "bar" },
                                 { "label": "VPN", "icon": "images/i-icon-4.png", "rightText": "VPN", "moveTo": "bar" }
                             ];
                    var testStore = new Memory({data:storeData});
                    var testList = new dojox.mobile.EdgeToEdgeStoreList({store:testStore}, "testList");
                    storeList.startup();
            });

For reference: it's worklight 5.0.5

Upvotes: 0

Views: 2083

Answers (1)

BuffaloBuffalo
BuffaloBuffalo

Reputation: 7852

Your main issue is that all of your dependencies in your require array need to match up with parameter names in the function. For example

require(['dep1','dep2','dep3'],function(dep1,dep2,dep3){});

So extrapolating that a bit

require(
["dojo",
  "dojo/parser",
  "dojo/_base/xhr",
  "dijit/form/ComboBox",
  "dojo/store/JsonRest",
  "dojo/ready",
  "dojox/mobile/EdgeToEdgeStoreList",
  "dojox/mobile",
  "dojox/mobile/parser",
  "dojox/io/xhrWindowNamePlugin",
  "dojox/io/windowName",
  "dojox/io/xhrPlugins",
  "dojo/dom-style",
  "dojo/dom",
  "dojo/dom-class",
  "dojo/_base/Deferred",
  "dojo/store/Memory"], function (dojo,parser,xhr,ComboBox,JsonRest,ready,EdgeToEdgetStoreList,mobile,parser,xhrPlugin,windowname,xhrPlugins,domStyle,dom,domClass,Deferred,Memory) {

  storeData = [{
    "label": "Wi-Fi",
    "icon": "images/i-icon-3.png",
    "rightText": "Off",
    "moveTo": "bar"
  }, {
    "label": "VPN",
    "icon": "images/i-icon-4.png",
    "rightText": "VPN",
    "moveTo": "bar"
  }];
    console.log(Memory);
  var testStore = new Memory({

    data: storeData
  });  
    var storeList = new dojox.mobile.EdgeToEdgeStoreList({
    store: testStore
  }, "testList");
  storeList.startup();

});

What was happening in your code snippet was that the parameter Memory was actually a different class than it's name implies. Based on the dependency array order it was an EdgeToEdgeStoreList.

Upvotes: 2

Related Questions