Question

Textarea字段在Modal中不可编辑（不可写）。我有两个textarea字段，在模态之外的字段工作正常，但我在模态中的字段不起作用。（我不能在该字段中写任何东西）。

查看我的代码！

var React   = require("react");
var Header = require('../../common/header.jsx');
var Sidebar = require('../../common/sidebar.jsx');
var Footer = require('../../common/footer.jsx');

var Body = React.createClass({

  closeCreatePollModal: function(e) {
      e.preventDefault();
      e.stopPropagation();

      this.refs.createPoll.close();
  },

  launchCreatePollModal: function(e) {
    e.preventDefault();
    e.stopPropagation();

    this.refs.createPoll.open({keyboard: true});
  },

  render: function() {
    return (
      <Container id='body'>
        <Grid>
          <Row>
            <Col sm={12} xs={12}>
              <textarea className="form-control border-radius" id='name' name='name' ref='name' defaultValue="Hello!"/>
              <Button className="edit-btn" onClick={this.launchCreatePollModal}>
                <Icon glyph='icon-fontello-edit'/>
              </Button>
            </Col>
          </Row>
        </Grid>
        <Grid>
          <Row>
            <Col xs={12}>
              <Modal ref='createPoll'>
                <ModalHeader>
                  <Button onClick={this.closeCreatePollModal} onTouchEnd={this.closeCreatePollModal} close />
                  <h4 className='modal-title'>Create New Poll Question</h4>
                </ModalHeader>
                <ModalBody>
                  <form>
                    <textarea className="form-control border-radius" id='text' name='text' ref='text' defaultValue="Hello!"/>
                  </form>
                </ModalBody>
                <ModalFooter>
                  <Button onClick={this.closeCreatePollModal} onTouchEnd={this.closeCreatePollModal}>Close</Button>
                  <Button bsStyle='primary'>Save changes</Button>
                </ModalFooter>
              </Modal>
            </Col>
          </Row>
        </Grid>
      </Container>
    );
  }
});

var Page = React.createClass({
  mixins: [ReactRouter.State, SidebarMixin],
  render: function() {
    var classes = React.addons.classSet({
      'container-open': this.state.open
    });
    return (
      <Container id='container' className={classes}>
        <Sidebar />
        <Header />
        <Body />
        <Footer />
      </Container>
    );
  }
});

module.exports = Page;

Textarea在reactjs Modal中不可编辑

0 个答案: