I've been trying to create a canvas element that you can resize with the value of a "select form". I'd prefer to use only Javascript to accomplish this. I feel like I'm missing a very small detail somewhere.

```js
var canvas = document.getElementById("canvas");
var context = canvas.getContext("2d");

canvas.width = 550;
canvas.height = 300;
drawScreen();

formElement = document.getElementById("height");
formElement.addEventListener('change', heightCanged, true);

formElement = document.getElementById("width");
formElement.addEventListener('change', widthCanged, false);

function widthChanged(e) {
  var target = e.target;
  canvas.width = target.value;
  drawScreen();
}

function heightChanged(e) {
  var target = e.target;
  canvas.height = target.value;
  drawScreen();
}
```

```css
#canvas {
  border: 1px solid black;
}
```

```html
//html
<canvas id="canvas"></canvas>

<h3>Height</h3>

<select id="height">
  <option value="1">1</option>
  <option value="2">2</option>
  <option value="3">3</option>
</select>

<h3>Width</h3>

<select id="width">
  <option value="1">1</option>
  <option value="2">2</option>
  <option value="3">3</option>
</select>
```

JS Fiddle
<http://jsfiddle.net/8ma4evLp/1/>