Adding an item to the top of a Dojo Select dijit, but can't select the second item

Question

I have two Select dijits that are based off the same data store. The first dijit is the required response and the second dijit is an optional response. For the second dijit, I want to add the additional item "None" to the top of the list. However, when I do that, I cannot select the second item in the list. In this JSBin, if you select "General lakebed mapping" in the second dijit, the returned value is the added item "None".

require(["dijit/form/Select",
  "dojo/data/ObjectStore",
  "dojo/store/Memory",
  "dojo/domReady!"
], function (Select, ObjectStore, Memory) {

  var data = [
      { id: 0, label: 'General lakebed mapping' },
      { id: 1, label: 'Bathymetry/Digital Elevation Model' },
      { id: 2, label: 'Ferrous object detections/magnetic anomalies' },
      { id: 3, label: 'Ground-truth data' },
      { id: 4, label: 'Lakebed color' },
      { id: 5, label: 'Lakebed surface type, hardness/smoothness/slope' },
      { id: 6, label: 'Sub-bottom geology' }
  ];

  var store = new Memory({
    data: data
  });

  var os = new ObjectStore({ objectStore: store });

  var s = new Select({
    store: os,
    sortByLabel: false
  }, "target");
  s.startup();

  data.unshift({ id: -1, label: 'None' })
  store.setData(data);
  var s1 = new Select({
    store: os,
    sortByLabel: false
  }, "target1");
  s1.startup();

  s1.on("change", function () {
    console.log("my value: ", this.get("value"))
  });
})

Answer 1

Do not use the value 0 as an id. It is a falsey value in JavaScript and I suspect that the Select dijit source treats it somewhere as false and fails. Just use another value in its place.