图像-React JS中的onclick事件

goutam 发表于 Dev

古塔姆

我在html / jquery代码中使用此库-datetimepicker_css.js。每当我单击图像时，都会在输入标签中填充类似mm：dd：yyyy hh：mm：ss的时间格式。

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

我正在尝试在React js代码中实现相同的功能，并面临这样做的问题。我可以填充start_time，但不能单击image标签并在start_time字段中进行替换。对此，我们将给予任何帮助/建议。

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

        )
    }

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

Kishore巴里克

render() {
        return (
                <form onSubmit={this.handleSubmit}>
                    <input value={this.state.first_name} onChange={this.setFirstName} placeholder="First name"/>
                    <input value={this.state.last_name} onChange={this.setLastName} placeholder="Last name"/>
                    <input value={this.state.start_time} onChange={this.setStartTime} placeholder="Start Time" id="demo1" name="stime"/>
                    <img src="images2/cal.gif" onClick={this.populateDate}/>
                    <button type="submit">Submit</button>
                </form>

        )
    },
populateDate(){
   NewCssCal('demo1','yyyyMMdd','dropdown',true,'24',true);

},

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