Image - onclick event in React JS
<p>I am using this library - datetimepicker_css.js in my html/jquery code. Whenever I click on the image, a time format like mm:dd:yyyy hh:mm:ss populates in input tag.</p>

<pre><code> Start time:&lt;input type="text" id="demo1" maxlength="25" size="25" name="stime" /&gt;                                                                                                                        
 &lt;img src="images2/cal.gif" onclick="javascript:NewCssCal ('demo1','yyyyMMdd','dropdown',true,'24',true)" style="cursor:pointer"/&gt;   
</code></pre>

<p>I am trying to implement same in react js code, and facing issues doing so. I could populate start_time but couldn't do a onclick of image tag and replace in the start_time field. Any help/suggestion on this is highly appreciated. </p>

<pre><code>  render() {
        return (
                &lt;form onSubmit={this.handleSubmit}&gt;
                    &lt;input value={this.state.first_name} onChange={this.setFirstName} placeholder="First name"/&gt;
                    &lt;input value={this.state.last_name} onChange={this.setLastName} placeholder="Last name"/&gt;
                    &lt;input value={this.state.start_time} onChange={this.setStartTime} placeholder="Start Time" id="demo1" name="stime"/&gt;
                    &lt;img src="images2/cal.gif" onclick="javascript:NewCssCal ('demo1','yyyyMMdd','dropdown',true,'24',true)"/&gt;
                    &lt;button type="submit"&gt;Submit&lt;/button&gt;
                &lt;/form&gt;

        )
    }

    getInitialState() {
        return {
            first_name: "John",
            last_name: "Doe",
            start_time: "03/11/2016",
        };
    },         
   setStartTime(event) {
        this.setState({start_time: event.target.value});
    },                                                                     
</code></pre>