title: Javascript onchange not catching on drop box change
body: <p>OK I am attempting to use onchange to capture the value from a dropbx but while I select the the value in the box it never seems to catch the onchange and I get an undefined value for the variable I try and capture the change with. I popped print statement into the onchange function call and it never seems to pick up the value switch. Any help is greatly appreciated</p>
  
  <pre><code>newWindow = window.open("", null, "height=400,width=800,status=yes,toolbar=no,menubar=no,location=no");
  
  newWindow.document.title = "Crafting Window";
  newWindow.document.body.style.background = "#00214D";
  newWindow.document.body.style.color = "White";
  
  // create a form and set properties
  var form = document.createElement('form');
  form.method = 'post';
  
  // insert into the body of the new window
  newWindow.document.body.appendChild(form);
  
  // add text before the input
  var cNumLab = document.createElement('cNumLab');
  form.appendChild(document.createTextNode('Craft Number:'));
  
  // add a text input
  var cNum = document.createElement('input');
  cNum.type = 'text';
  cNum.name = 'input';
  cNum.value = '';
  form.appendChild(cNum);
  
  //add linebreak
  var linebreak = document.createElement('br');
  form.appendChild(linebreak);
  
  // add text before the input
  var sDescL = document.createElement('sDescL');
  form.appendChild(document.createTextNode('Short Desc:'));
  
  // add a text input
  var sDesc = document.createElement('input');
  sDesc.type = 'text';
  sDesc.name = 'sDesc';
  sDesc.value = '';
  sDesc.size = 50;
  form.appendChild(sDesc);
  
  //add linebreak
  var linebreak = document.createElement('br');
  form.appendChild(linebreak);
  
  // add text before the input
  var lDescL = document.createElement('lDesc');
  form.appendChild(document.createTextNode('Long Desc:'));
  
  // add a text input
  var lDesc = document.createElement('input');
  lDesc.type = 'text';
  lDesc.name = 'lDesc';
  lDesc.value = '';
  lDesc.size = 80;
  form.appendChild(lDesc);
  
  //add linebreak
  var linebreak = document.createElement('br');
  form.appendChild(linebreak);
  
  // add text before the input
  var eDescL = document.createElement('eDescL');
  form.appendChild(document.createTextNode('Extended Desc:'));
  
  //add linebreak
  var linebreak = document.createElement('br');
  form.appendChild(linebreak);
  
  // add a text input
  var eDesc = document.createElement('textarea');
  eDesc.type = 'text';
  eDesc.name = 'eDesc';
  eDesc.value = '';
  form.appendChild(eDesc);
  
  //add linebreak
  var linebreak = document.createElement('br');
  form.appendChild(linebreak);
  
  // add text before the input
  var eTools = document.createElement('eTools');
  form.appendChild(document.createTextNode('Tools:'));
  
  // add a text input
  var eTool = document.createElement('input');
  eTool.type = 'text';
  eTool.name = 'eTools';
  eTool.value = '';
  form.appendChild(eTool);
  
  
  var tools = document.createElement('select');
  tools.id = 'sTools';
  tools.name = 'sTools';
  form.appendChild(tools);
  
  var cTool;
  var e = document.getElementById("sTools");
  var options = [
      ["Forge 33", "33"],
      ["Workbench 1391", "1391"],
      ["Oven 1753", "1753"],
      ["Mortar-Pestle 3277", "3277"],
      ["Chisel 3349", "3349"],
      ["Pottery Wheel 3420", "3420"],
      ["Kiln 3421", "3421"],
      ["Blowpipe3422", "3422"],
      ["Bookbinder 3467", "3467"],
      ["Palette 3483", "3483"]
  ];
  
  for (var i = 0; i &lt; options.length; i++) {
      var opt = document.createElement('option');
      opt.appendChild(document.createTextNode(options[i][0]));
      opt.value = options[i][1];
      tools.appendChild(opt);
  }
  
  tools.onchange = function () {
      print("GOT HERE");
      cTool = e.options[e.selectedIndex].value;
      alert(cTool);
  };
  
  //add linebreak
  var linebreak = document.createElement('br');
  form.appendChild(linebreak);
  
  // add text before the input
  var eIngreds = document.createElement('eIngreds');
  form.appendChild(document.createTextNode('Ingredients:'));
  
  // add a text input
  var eIngred = document.createElement('input');
  eIngred.type = 'text';
  eIngred.name = 'eIngred';
  eIngred.value = '';
  eIngred.size = 50;
  form.appendChild(eIngred);
  
  
  //add linebreak
  var linebreak = document.createElement('br');
  form.appendChild(linebreak);
  
  // add text before the input
  var eSteps1 = document.createElement('eSteps1');
  form.appendChild(document.createTextNode('Step 1:'));
  
  // add a text input
  var eStep1 = document.createElement('input');
  eStep1.type = 'text';
  eStep1.name = 'eStep1';
  eStep1.value = '';
  eStep1.size = 80;
  form.appendChild(eStep1);
  
  //add linebreak
  var linebreak = document.createElement('br');
  form.appendChild(linebreak);
  
  // add text before the input
  var eSteps1 = document.createElement('eSteps2');
  form.appendChild(document.createTextNode('Step 2:'));
  
  // add a text input
  var eStep2 = document.createElement('input');
  eStep2.type = 'text';
  eStep2.name = 'eStep2';
  eStep2.value = '';
  eStep2.size = 80;
  form.appendChild(eStep2);
  
  //add linebreak
  var linebreak = document.createElement('br');
  form.appendChild(linebreak);
  
  // add text before the input
  var eSteps3 = document.createElement('eSteps3');
  form.appendChild(document.createTextNode('Step 3:'));
  
  // add a text input
  var eStep3 = document.createElement('input');
  eStep3.type = 'text';
  eStep3.name = 'eStep3';
  eStep3.value = '';
  eStep3.size = 80;
  form.appendChild(eStep3);
  
  //add linebreak
  var linebreak = document.createElement('br');
  form.appendChild(linebreak);
  
  // add text before the input
  var eSteps4 = document.createElement('eSteps4');
  form.appendChild(document.createTextNode('Step 4:'));
  
  // add a text input
  var eStep4 = document.createElement('input');
  eStep4.type = 'text';
  eStep4.name = 'eStep4';
  eStep4.value = '';
  eStep4.size = 80;
  form.appendChild(eStep4);
  
  //add linebreak
  var linebreak = document.createElement('br');
  form.appendChild(linebreak);
  
  // add text before the input
  var eSteps5 = document.createElement('eSteps5');
  form.appendChild(document.createTextNode('Step 5:'));
  
  // add a text input
  var eStep5 = document.createElement('input');
  eStep5.type = 'text';
  eStep5.name = 'eStep5';
  eStep5.value = '';
  eStep5.size = 80;
  form.appendChild(eStep5);
  
  //add linebreak
  var linebreak = document.createElement('br');
  form.appendChild(linebreak);
  
  // add text before the input
  var eSteps6 = document.createElement('eSteps6');
  form.appendChild(document.createTextNode('Step 6:'));
  
  // add a text input
  var eStep6 = document.createElement('input');
  eStep6.type = 'text';
  eStep6.name = 'eStep6';
  eStep6.value = '';
  eStep6.size = 80;
  form.appendChild(eStep6);
  
  var cTool;
  var e = document.getElementById("sTools");
  
  tools.onchange = function () {
      cTool = e.options[e.selectedIndex].value;
      alert(cTool);
  
  };
  
  //add linebreak
  var linebreak = document.createElement('br');
  form.appendChild(linebreak);
  
  var eSubmit = document.createElement('button');
  eSubmit.type = 'button';
  //eSubmit.name = 'Submit Design';
  eSubmit.innerHTML = 'Submit Design';
  eSubmit.onclick = function () {
  
      if (sDesc.value !== "") {
          client.send_direct("craft edit " + cNum.value + " short_desc " + sDesc.value);
      }
      if (lDesc.value !== "") {
          client.send_direct("craft edit " + cNum.value + " long_desc " + lDesc.value);
      }
      if (eDesc.value !== "") {
          client.send_direct("craft edit " + cNum.value + " extended_desc " + eDesc.value);
      }
      if (eIngred.value !== "") {
          client.send_direct("craft ingredients " + cNum.value + "  " + eIngred.value);
      }
      if (eTool.value !== "") {
          client.send_direct("craft tools " + cNum.value + " add " + eTool.value);
      }
      if (eStep1.value !== "") {
          client.send_direct("craft steps " + cNum.value + " change 1 1 " + eStep1.value);
      }
      if (eStep2.value !== "") {
          client.send_direct("craft steps " + cNum.value + " change 2 1 " + eStep2.value);
      }
      if (eStep3.value !== "") {
          client.send_direct("craft steps " + cNum.value + " change 3 1 " + eStep3.value);
      }
      if (eStep4.value !== "") {
          client.send_direct("craft steps " + cNum.value + " change 4 1 " + eStep4.value);
      }
      if (eStep5.value !== "") {
          client.send_direct("craft steps " + cNum.value + " change 5 1 " + eStep5.value);
      }
      if (eStep6.value !== "") {
          client.send_direct("craft steps " + cNum.value + " change 6 1 " + eStep6.value);
      }
      alert(cTool);
  };
  form.appendChild(eSubmit);
  </code></pre>