webui: focus invalid widget on validation error

Reviewed-By: Fraser Tweedale <ftweedal@redhat.com>
Reviewed-By: Endi Sukma Dewata <edewata@redhat.com>

3 files changed, 30 insertions, 3 deletions

diff --git a/install/ui/src/freeipa/add.js b/install/ui/src/freeipa/add.js
index a4b5d3649..78f3890ad 100644
--- a/install/ui/src/freeipa/add.js
+++ b/install/ui/src/freeipa/add.js
@@ -20,7 +20,7 @@
 */
 
 define(['./ipa', './jquery', './navigation', './rpc', './text', './field', './widget', './dialog'],
-       function(IPA, $, navigation, rpc, text) {
+       function(IPA, $, navigation, rpc, text, field_mod, widget_mod) {
 
 /**
  * Entity adder dialog
@@ -219,7 +219,10 @@ IPA.entity_adder_dialog = function(spec) {
      */
     that.add = function(on_success, on_error) {
 
-        if (!that.validate()) return;
+        if (!that.validate()) {
+            widget_mod.focus_invalid(that);
+            return;
+        }
 
         var record = {};
         that.save(record);
diff --git a/install/ui/src/freeipa/details.js b/install/ui/src/freeipa/details.js
index ed057e98c..7aa4c0ef6 100644
--- a/install/ui/src/freeipa/details.js
+++ b/install/ui/src/freeipa/details.js
@@ -31,9 +31,10 @@ define([
         './rpc',
         './spec_util',
         './text',
+        './widget',
         './facet',
         './add'],
-    function(lang, builder, IPA, $, phases, reg, rpc, su, text) {
+    function(lang, builder, IPA, $, phases, reg, rpc, su, text, widget_mod) {
 
 /**
  * Details module
@@ -1436,6 +1437,7 @@ exp.update_action = IPA.update_action = function(spec) {
 
         if (!facet.validate()) {
             facet.show_validation_error();
+            widget_mod.focus_invalid(facet);
             return;
         }
 
diff --git a/install/ui/src/freeipa/widget.js b/install/ui/src/freeipa/widget.js
index 1db0052f4..ae1ada239 100644
--- a/install/ui/src/freeipa/widget.js
+++ b/install/ui/src/freeipa/widget.js
@@ -5756,6 +5756,28 @@ exp.activity_widget = IPA.activity_widget = function(spec) {
 };
 
 /**
+ * Find and focus first focusable invalid widget
+ * @member widget
+ * @param {IPA.widget|facet.facet} widget Widget container
+ * @return {boolean} A widget was focused
+ */
+exp.focus_invalid = function(widget) {
+
+    var widgets = widget.widgets.widgets;
+    var focused = false;
+    for (var i=0, l=widgets.length; i<l; i++) {
+        var w = widgets.values[i];
+        if (w.valid === false && w.focus_input) {
+            w.focus_input();
+            focused = true;
+        }
+        else if (w.widgets) focused = exp.focus_invalid(w);
+        if (focused) break;
+    }
+    return focused;
+};
+
+/**
  * pre_op operations for widgets
  * - sets facet and entity if present in context
  * @member widget