Skip to content

Commit 3e561b4

Browse files
committed
Submit form
1 parent 787de60 commit 3e561b4

File tree

1 file changed

+34
-3
lines changed

1 file changed

+34
-3
lines changed

public/scripts/example.js

Lines changed: 34 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -58,11 +58,42 @@ var CommentList = React.createClass({
5858
});
5959

6060
var CommentForm = React.createClass({
61+
getInitialState: function() {
62+
return {author: '', text: ''};
63+
},
64+
handleAuthorChange: function(e) {
65+
this.setState({author: e.target.value});
66+
},
67+
handleTextChange: function(e) {
68+
this.setState({text: e.target.value});
69+
},
70+
handleSubmit: function(e) {
71+
e.preventDefault();
72+
var author = this.state.author.trim();
73+
var text = this.state.text.trim();
74+
if (!text || !author) {
75+
return;
76+
}
77+
// TODO: send request to the server
78+
this.setState({author: '', text: ''});
79+
},
6180
render: function() {
6281
return (
63-
<div className="commentForm">
64-
Hello, world! I am a CommentForm.
65-
</div>
82+
<form className="commentForm" onSubmit={this.handleSubmit}>
83+
<input
84+
type="text"
85+
placeholder="Your name"
86+
value={this.state.author}
87+
onChange={this.handleAuthorChange}
88+
/>
89+
<input
90+
type="text"
91+
placeholder="Say something..."
92+
value={this.state.text}
93+
onChange={this.handleTextChange}
94+
/>
95+
<input type="submit" value="Post" />
96+
</form>
6697
);
6798
}
6899
});

0 commit comments

Comments
 (0)