@ -481,16 +481,17 @@ Let's make the form interactive. When the user submits the form, we should clear
```javascript{3-13,16-18}
// tutorial16.js
var CommentForm = React.createClass({
handleSubmit: function() {
handleSubmit: function(e) {
e.preventDefault();
var author = this.refs.author.getDOMNode().value.trim();
var text = this.refs.text.getDOMNode().value.trim();
if (!text || !author) {
return false;
return;
}
// TODO: send request to the server
this.refs.author.getDOMNode().value = '';
this.refs.text.getDOMNode().value = '';
return false;
return;
},
render: function() {
return (
@ -508,7 +509,7 @@ var CommentForm = React.createClass({
React attaches event handlers to components using a camelCase naming convention. We attach an `onSubmit` handler to the form that clears the form fields when the form is submitted with valid input.
We always return `false` from the event handler to prevent the browser's default action of submitting the form. (If you prefer, you can instead take the event as an argument and call `preventDefault()` on it.)
Call `preventDefault()` on the event to prevent the browser's default action of submitting the form.
##### Refs
@ -562,16 +563,17 @@ Let's call the callback from the `CommentForm` when the user submits the form:
```javascript{6}
// tutorial18.js
var CommentForm = React.createClass({
handleSubmit: function() {
handleSubmit: function(e) {
e.preventDefault();
var author = this.refs.author.getDOMNode().value.trim();
var text = this.refs.text.getDOMNode().value.trim();