Suggest a feature
×

Welcome to TagMyCode

Please login or create account to add a snippet.
0
0
 
0
Language: Javascript
Posted by: Mirko Jelic
Added: Feb 9, 2019 11:00 AM
Views: 20
Tags: react
  1. import React from 'react'
  2. import classNames from 'classnames'
  3.  
  4. const SelectListGroup = (
  5.   {
  6.     name,
  7.     value,
  8.     label,
  9.     multiple,
  10.     size,
  11.     error,
  12.     autofocus,
  13.     placeholder,
  14.     options,
  15.     info,
  16.     onChange,
  17.     disabled
  18.   }
  19.  
  20. ) => {
  21.  
  22.   const selectOption = options.map((option,index) => (
  23.     <option className='form-control--option' key={index} value={option.value}>{option.label}</option>
  24.   ))
  25.  
  26.   return (
  27.     <div className='form-control'>
  28.       {error && <div className="form-control__invalid--feedback">{error}</div>}
  29.       <select
  30.         className={classNames('form-control__input',{'form-control__input--invalid':error})}
  31.         placeholder={placeholder}
  32.         name={name}
  33.         value={value}
  34.         onChange={onChange}
  35.         disabled={disabled}
  36.       >{selectOption}</select>
  37.       {info && <small className="form__info">{info}</small>}
  38.     </div>
  39.   )
  40. }
  41.  
  42. export default SelectListGroup
  43.