Do not automatically select other options
For <select multiple />, `value` is an array and should not be converted to a string.
WU Jun committed
Dec 18, 2013 at 09:06 UTC
9a4a8aa71a0ce5a255dfba533fec3ff885a7d708
2 files changed
+26
-4
src/dom/components/ReactDOMSelect.js
+12
-4
@@ -59,13 +59,21 @@ function selectValueType(props, propName, componentName) {
59
*/
60
function updateOptions() {
61
/*jshint validthis:true */
62
+ var multiple = this.props.multiple;
63
var propValue = this.getValue();
64
var value = propValue != null ? propValue : this.state.value;
65
var options = this.getDOMNode().options;
65
- var selectedValue = '' + value;
66
-
67
- for (var i = 0, l = options.length; i < l; i++) {
68
- var selected = this.props.multiple ?
66
+ var selectedValue, i, l;
67
+ if (multiple) {
68
+ selectedValue = [];
69
+ for (i = 0, l = value.length; i < l; ++i) {
70
+ selectedValue.push('' + value[i]);
71
+ }
72
+ } else {
73
+ selectedValue = '' + value;
74
+ }
75
+ for (i = 0, l = options.length; i < l; i++) {
76
+ var selected = multiple ?
77
selectedValue.indexOf(options[i].value) >= 0 :
78
selected = options[i].value === selectedValue;
79
src/dom/components/__tests__/ReactDOMSelect-test.js
+14
@@ -116,6 +116,20 @@ describe('ReactDOMSelect', function() {
116
expect(node.options[2].selected).toBe(false); // gorilla
117
});
118
119
+ it('should not select other options automatically', function() {
120
+ var stub =
121
+ <select multiple={true} value={['12']}>
122
+ <option value="1">one</option>
123
+ <option value="2">two</option>
124
+ <option value="12">twelve</option>
125
+ </select>;
126
+ var node = renderSelect(stub);
127
+
128
+ expect(node.options[0].selected).toBe(false); // one
129
+ expect(node.options[1].selected).toBe(false); // two
130
+ expect(node.options[2].selected).toBe(true); // twelve
131
+ });
132
+
133
it('should allow setting `value` with `objectToString`', function() {
134
var objectToString = {
135
animal: "giraffe",