[Docs] Fix tutorial line highlights, revert ajax in cb
Cheng Lou committed
Jun 30, 2014 at 00:55 UTC
66d6e3f3919d338e7f773220a8f32f147a8190d4
1 file changed
+15
-19
docs/docs/tutorial.md
+15
-19
@@ -301,7 +301,7 @@ React.renderComponent(
301
302
Now that the data is available in the `CommentList`, let's render the comments dynamically:
303
304
-```javascript{4-6,9}
304
+```javascript{4-10,13}
305
// tutorial10.js
306
var CommentList = React.createClass({
307
render: function() {
@@ -475,7 +475,7 @@ var CommentForm = React.createClass({
475
476
Let's make the form interactive. When the user submits the form, we should clear it, submit a request to the server, and refresh the list of comments. To start, let's listen for the form's submit event and clear it.
477
478
-```javascript{3-13,16-17,21}
478
+```javascript{3-13,16-18}
479
// tutorial16.js
480
var CommentForm = React.createClass({
481
handleSubmit: function() {
@@ -517,7 +517,7 @@ When a user submits a comment, we will need to refresh the list of comments to i
517
518
We need to pass data from the child component to its parent. We do this by passing a `callback` in props from parent to child:
519
520
-```javascript{15-17,31}
520
+```javascript{15-17,30}
521
// tutorial17.js
522
var CommentBox = React.createClass({
523
loadCommentsFromServer: function() {
@@ -651,22 +651,18 @@ var CommentBox = React.createClass({
651
handleCommentSubmit: function(comment) {
652
var comments = this.state.data;
653
var newComments = comments.concat([comment]);
654
- this.setState({data: newComments}, function() {
655
- // `setState` accepts a callback. To avoid (improbable) race condition,
656
- // `we'll send the ajax request right after we optimistically set the new
657
- // `state.
658
- $.ajax({
659
- url: this.props.url,
660
- dataType: 'json',
661
- type: 'POST',
662
- data: comment,
663
- success: function(data) {
664
- this.setState({data: data});
665
- }.bind(this),
666
- error: function(xhr, status, err) {
667
- console.error(this.props.url, status, err.toString());
668
- }.bind(this)
669
- });
654
+ this.setState({data: newComments});
655
+ $.ajax({
656
+ url: this.props.url,
657
+ dataType: 'json',
658
+ type: 'POST',
659
+ data: comment,
660
+ success: function(data) {
661
+ this.setState({data: data});
662
+ }.bind(this),
663
+ error: function(xhr, status, err) {
664
+ console.error(this.props.url, status, err.toString());
665
+ }.bind(this)
666
});
667
},
668
getInitialState: function() {