Meteor React-Bootstrap: how to set value to FormControl

Question

Users enter text string into FormControl, I want to put it back trimmed and lower-cased.

handleSubmit(event) {
    event.preventDefault();

    console.log("submitted: "+ this.vehicleReg.value.trim().toLowerCase());
    this.refs.vehicleReg.value=this.vehicleReg.value.trim().toLowerCase();
}

render() {
    return(
        <form className="user-data" onSubmit={this.handleSubmit.bind(this)}>
            <FormGroup label="Data">
                <FormControl
                    inputRef={(input) => this.vehicleReg = input} type="text"
                    placeholder="Reg Number"

Answer 1

Add a name attribute to your FormControl then do the following in handleSubmit

document.querySelector('[name="regNum"]').value = document.querySelector('[name="regNum"]').value.trim().toLowerCase();