Set the value of a <select> element in D3?

I may be wrong, but is it because you did not include d3.js?

<script src="http://d3js.org/d3.v3.min.js" charset="utf-8"></script>

I can't see it in the frame source for some reason. Also, select should have a id of myselect

<select>
    <option value="England">England</option>
    <option id = "myselect" value="France">France</option>
    <option value="Italy">Italy</option>
</select>

You need to use property instead of attr for setting the value.

d3.select('#myselect').property('value', 'France');

From the d3 docs:

Some HTML elements have special properties that are not addressable using standard attributes or styles. For example, form text fields have a value string property, and checkboxes have a checked boolean property. You can use the property operator to get or set these properties, or any other addressable field on the underlying element, such as className.

https://github.com/mbostock/d3/wiki/Selections#property

Albert's comments are also correct regarding your JSFiddle missing the d3.js reference and not specifying the id of "myselect" on the select element.

Tags:

D3.Js