tanvirraj
1/19/2017 - 3:39 PM

Forum.js

Forum.js 

// 

var Forum = React.createClass({

	getInitialState: function () {
		return {
			allAnswers: {
				"1" : {
					body: " this is first question",
					correct: false
				},
				"2" : {
					body: " Here is another question",
					correct: false
				},
				"3" : {
					body: " Is react is good ",
					correct: false
				},
			}
		}
	},


	render: function() {
		return (

		   <div>
        <ForumHeader />

         <div>
           <ForumQuestion />
           <hr />
           <ForumAnswers allAnswers={this.state.allAnswers} />
           <hr />
           <h4> Add an Answer </h4>
           <ForumAddAnswerBox onAddAnswer={this._onAddAnswer } />
         </div>

		   </div>
		);
	},

	_onAddAnswer: function(answerText) {
		ForumDispatcher.dispatch({
			actionType: 'FORUM_ANSWER_ADDED',
			newAnswer: answerText 
		}); 
	}



});



---------

ForumAddAnswerBox.js 

// 
var ForumAddAnswerBox = React.createClass({

  getInitialState: function() {
    return {
      value: ' '
    };
  },

  _addAnswer: function() {
    this.props.onAddAnswer(this.state.value); 
    console.log(this.state.value);
  },



  render: function() {
    return (
      <div>
        <textarea id="addAnswer"
                  className="col-md-6 col-xs-8"
                  onChange = {this._onChange } >
        </textarea>
        
        <input  type="button" 
                className="btn btn-primary"
                value="Add"
                onClick= { this._addAnswer }

         />
      </div>
    );
  },

  _onChange: function(event) {
    this.setState({
      value: event.target.value
    }); 
  },

});