skyquake/framework/widgets/form_controls/selectOption.jsx

   1 /*
   2  *
   3  *   Copyright 2016 RIFT.IO Inc
   4  *
   5  *   Licensed under the Apache License, Version 2.0 (the "License");
   6  *   you may not use this file except in compliance with the License.
   7  *   You may obtain a copy of the License at
   8  *
   9  *       http://www.apache.org/licenses/LICENSE-2.0
  10  *
  11  *   Unless required by applicable law or agreed to in writing, software
  12  *   distributed under the License is distributed on an "AS IS" BASIS,
  13  *   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  14  *   See the License for the specific language governing permissions and
  15  *   limitations under the License.
  16  *
  17  */
  18 import React from 'react';
  19
  20 export default class SelectOption extends React.Component {
  21   constructor(props){
  22     super(props);
  23     this.state = {};
  24   }
  25   handleOnChange = (e) => {
  26     this.props.onChange(e);
  27   }
  28   render() {
  29     let html;
  30     let defaultValue = this.props.defaultValue;
  31     let options =  this.props.options.map(function(op, i) {
  32       let value = JSON.stringify(op.value);
  33       return <option key={i} value={JSON.stringify(op.value)}>{op.label}</option>
  34     });
  35     if (this.props.initial) {
  36       options.unshift(<option key='blank' value={JSON.stringify(this.props.defaultValue)}></option>);
  37     }
  38     html = (
  39         <label>
  40             {this.props.label}
  41             <select className={this.props.className} onChange={this.handleOnChange} defaultValue={JSON.stringify(defaultValue)} >
  42                 {
  43                  options
  44                 }
  45             </select>
  46         </label>
  47     );
  48     return html;
  49   }
  50 }
  51 SelectOption.defaultProps = {
  52   options: [],
  53   onChange: function(e) {
  54     console.dir(e)
  55   },
  56   defaultValue: false,
  57   initial: false,
  58   label: null
  59 }