ReactJS defaultChecked is not allowing to select the checkbox

As in the question title, I am not able to mark the checkbox as selected, on onChange event of the selectbox like this,

<select id='featuresType'
onChange={this.handleChange.bind(this, 'type')} >
 {this.getOptions(featuresType)}
 </select>

were as the handleChange is like :

 handleChange: function (field, e) { 
            if (field == 'type') {
                let selected = e.target.value;
                this.setState({typeSelected: selected})
            }
            /*Why the console is taking the previous selecte option, ex: if Locker is selectec below lone prints 'dc' */
             console.log(field ,',',  this.state.typeSelected)
        },

when it is bind to defaultValue,

defaultChecked={(this.state.typeSelected =='locker')}

1. The select box is not able to mark wrt the condition given, but manually could able to mark checked/notchecked.

checked={(this.state.typeSelected =='locker')}

2. On this checked attribute, the checkbox is able to mark as checked, based on select box option value. BUT in this case the manual way of checking or un-checking is not happening.

Hope you guys got my problem

Here is the JSFiddle

I wanted the checkbox to act both ways, on select of the option, the checkbox should be checked. And also user can check/Uncheck the checkbox Manully