You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@allura.apache.org by je...@apache.org on 2015/08/13 20:07:03 UTC
[36/50] allura git commit: [#7959] set focus to our input box
initially, as well as after errors and when proceeding to next step
[#7959] set focus to our input box initially, as well as after errors and when proceeding to next step
Project: http://git-wip-us.apache.org/repos/asf/allura/repo
Commit: http://git-wip-us.apache.org/repos/asf/allura/commit/96538161
Tree: http://git-wip-us.apache.org/repos/asf/allura/tree/96538161
Diff: http://git-wip-us.apache.org/repos/asf/allura/diff/96538161
Branch: refs/heads/ib/7922
Commit: 96538161cc5b03e24a86fedb8a9e72b40165a0c6
Parents: 4090d3b
Author: Dave Brondsema <db...@slashdotmedia.com>
Authored: Wed Aug 12 18:53:38 2015 +0000
Committer: Dave Brondsema <db...@slashdotmedia.com>
Committed: Wed Aug 12 18:53:38 2015 +0000
----------------------------------------------------------------------
Allura/allura/public/nf/js/phone-verification.js | 19 ++++++++++++++-----
1 file changed, 14 insertions(+), 5 deletions(-)
----------------------------------------------------------------------
http://git-wip-us.apache.org/repos/asf/allura/blob/96538161/Allura/allura/public/nf/js/phone-verification.js
----------------------------------------------------------------------
diff --git a/Allura/allura/public/nf/js/phone-verification.js b/Allura/allura/public/nf/js/phone-verification.js
index 4af2a9e..01792fe 100644
--- a/Allura/allura/public/nf/js/phone-verification.js
+++ b/Allura/allura/public/nf/js/phone-verification.js
@@ -48,7 +48,7 @@ function render(state) {
var FormStepMixin = {
- /*
+ /*
* Subclasses must implement:
* - getAPIUrl(): return API url this step will submit to
* - getAPIData(): returns data to submit to API url
@@ -60,11 +60,13 @@ var FormStepMixin = {
render: function() {
var input_props = {
type: 'text',
+ ref: 'mainInput',
className: grid,
value: this.props.state[this.getKey()],
disabled: this.isInputDisabled(),
onChange: this.handleChange,
- onKeyDown: this.onKeyDown
+ onKeyDown: this.onKeyDown,
+ autoFocus: true
};
var button_props = {
onClick: this.handleClick,
@@ -83,6 +85,13 @@ var FormStepMixin = {
dom('button', button_props, 'Submit')));
},
+ componentDidMount: function() {
+ React.findDOMNode(this.refs.mainInput).focus();
+ },
+ componentDidUpdate: function() {
+ React.findDOMNode(this.refs.mainInput).focus();
+ },
+
getErrorHtml: function() {
return {__html: this.props.state.error || ' '};
},
@@ -94,7 +103,7 @@ var FormStepMixin = {
getMessage: function() { return this.getHtml('message-' + this.getKey()); },
getExtraMessage: function() { return this.getHtml('message-extra'); },
-
+
handleClick: function() {
if (!this.isButtonDisabled()) {
set_state({error: null});
@@ -146,7 +155,7 @@ var FormStepMixin = {
var StepVerify = React.createClass({
mixins: [FormStepMixin],
-
+
getAPIUrl: function() { return 'verify_phone'; },
getAPIData: function() { return {'number': this.props.state[this.getKey()]}; },
getLabel: function() { return 'Enter phone number'; },
@@ -156,7 +165,7 @@ var StepVerify = React.createClass({
var StepCheck = React.createClass({
mixins: [FormStepMixin],
-
+
getAPIUrl: function() { return 'check_phone_verification'; },
getAPIData: function() { return {'pin': this.props.state[this.getKey()]}; },
getLabel: function() { return 'Enter your PIN'; },