Search code examples
inputdefaultreact-bootstrap

How to make button default on react-bootstrap

I have a login form made with react-bootstrap. The form inputs for user name and password and "login" button. I want to let user submit the form by pressing "enter" on a keyboard, in addition to clicking on "login" button with a mouse. How can I do this?

var ReactBootstrap = require('react-bootstrap');
var Input = ReactBootstrap.Input;
var Button = ReactBootstrap.Button;
...
render: function() {
return (
<form>
    <Input type="text"... />
    <Input type="password" .../>
    <Button bsStyle="primary"...>Login</Button>
</form>
);

}

Solution

  • I think I figured out, I have to use ButtonInput type="submit"

    var ReactBootstrap = require('react-bootstrap');
var Input = ReactBootstrap.Input;
var ButtonInput = ReactBootstrap.ButtonInput;
...
render: function() {
return (
<form>
    <Input type="text"... />
    <Input type="password" .../>
    <ButtonInput type="submit" bsStyle="primary"...>Login</ButtonInput>
</form>
);