Rakesh Adoni:

I am using ReactJS with Bootstrap and is unable to get dropdown data that I am passing, in the event handler. The html is not built with option lists only input field is coming.

My code looks like:

import  React from 'react';
import PropTypes from 'prop-types';
import { FormWithConstraints, FieldFeedback } from 'react-form-with-constraints';
import { FieldFeedbacks, FormGroup, FormControlLabel, FormControlInput } from 'react-form-with-constraints-bootstrap4';

class Select extends  React.Component{

    handleChange(event) {
        //event.target.value
        //do required changes

    }

    render(){
        return(

{this.props.label}{this.props.required?                        style=>*:null}
                        id={"Source"}
                        label={this.props.label}
                        placeholder="Select Country"
                        type="text"
                        // value={this.props.value}
                        onChange={this.handleChange}
                            // (event)=>{
                            // this.handleChange(event);
                            // this.props.onChange(event);

                        // }}
                        options={this.props.dropDownList}
                        required={this.props.required}
                        className="form-control"
                        optionsKey="name"
                        optionsValue="id"
                        // readOnly={this.props.readOnly}
                        // onClick={this.props.onClick}
                    />
                                    style={styles.errorStyle}>

                        {(this.props.required)?
 /^ *$/.test(value)}>Please enter valid text:null}



        );
    }
}

and the drop data looks like

dropDownList=[ {name: "NAme",id:1,key:"Key"}];