ReactJS的onSubmit表单不起作用
ReactJS onSubmit on form doesn't work
我有一个神秘的问题:当我点击按钮或按回车键时,什么都没有发生。
Row = ReactBootstrap.Row
Col = ReactBootstrap.Col
Input = ReactBootstrap.Input
Button = ReactBootstrap.Button
@NewSession = React.createClass
handleSubmit: (e) ->
alert 'f'
e.preventDefault()
Dispatcher.query('sessions', {}, 'POST')
render: ->
<form onSubmit={@handleSubmit} noValidate>
<Row>
<Col md={6} mdOffset={3} className='text-center'>
<Input type='text' placeholder='Your username' ref='login' />
<Input type='text' placeholder='Your password' ref='password' />
<Button bsStyle='success'>Sign in</Button>
</Col>
</Row>
</form>
这种奇怪行为的原因是什么?为什么handlessubmit不工作?
如果我把onClick={@handleSubmit}
处理程序放在按钮上,点击它就可以了
react-bootstrap Button
组件默认为type="button"
,因此您需要添加type="submit"
来创建提交按钮。
<Button type='submit' bsStyle='success'>Sign in</Button>
您没有任何提交事件…您需要在呈现方法中声明type=submit。然后你可以使用onSubmit事件处理函数。在下面的例子:
<form onSubmit={this.handleSubmit.bind(this)}>
<div className="form-group col-sm-7">
<input type="text" className="form-control" ref="inputmessage" id="inputDefault" />
</div>
<div className="form-group col-sm-5">
<button type="submit" className="btn btn-block btn-primary">Send Message </button>
</div>
</form>
相关文章:
- 动态Javascript表单不起作用
- 加载后的页面与ajax表单提交不起作用
- Jquery的表单验证不起作用
- Ajax在JQuery表单插件中不起作用
- 带有select的jquery提交表单不起作用
- 编辑不起作用的表单的特定行和重置特定字段
- jQuery日期选择器在Codeigniter和Bootsrap模式表单中不起作用
- 表单中的提交按钮在 PHP 打印中不起作用
- HTML表单在IE中不起作用
- 下拉 jquery 方法发布表单不起作用
- 表单提交前客户端地理编码的实现;不起作用
- JavaScript onChange 事件侦听器对输入表单不起作用
- 谷歌浏览器模式正则表达式在使用setCustomValidity动态创建表单时不起作用
- 表单验证在 HTML 中工作的 Visualforce 中不起作用
- 表单验证不起作用,并阻止表单提交
- JS表单验证功能不起作用
- 刷新<表单>送审不起作用
- onClick 事件在表单标记中不起作用
- 返回false不起作用,单击h:commandButton将触发操作
- 动画不起作用后单击JQuery