F #2711: goes to the tab there is an error (#2924)

src/sunstone/public/app/sunstone.js

@@ -1033,7 +1033,6 @@ define(function(require) {
     //_popFormPanelLoading(tabId);
     // Workaround until Foundation.abide support hidden forms
 
-    var context = $("#" + tabId);
     $(".sunstone-form-title", context).text(Locale.tr("Submitting..."));
     $(".submit_button", context).text(Locale.tr("Submitting..."));
 
@@ -1041,7 +1040,6 @@ define(function(require) {
 
     setTimeout(function() {
       var formPanelInstance = SunstoneCfg["tabs"][tabId].activeFormPanel;
-
       if ($(".wizardForms", context).is(":visible")) {
         $("#" + formPanelInstance.formPanelId + "Wizard").submit();
       } else if ($(".advancedForms", context).is(":visible")) {

src/sunstone/public/app/utils/form-panels/form-panel.js

@@ -17,9 +17,9 @@
 define(function(require) {
   // Dependencies
 //  require('foundation.abide');
-  var Notifier = require('utils/notifier');
-  var Locale = require('utils/locale');
-  var Sunstone = require('sunstone');
+  var Notifier = require("utils/notifier");
+  var Locale = require("utils/locale");
+  var Sunstone = require("sunstone");
 
   function BaseFormPanel() {
     this.formContext = $("#" + this.tabId+" div[form-panel-id="+this.formPanelId+"]");
@@ -28,16 +28,16 @@ define(function(require) {
   }
 
   BaseFormPanel.prototype = {
-    'insert': _insert,
-    'reInit': _reInit,
-    'reset': _reset,
-    'setAction': _setAction,
-    'title': _title,
-    'setHeader': _setHeader,
-    'buttonText': _buttonText,
-    'resetButton': _resetButton,
-    'actionOptions': _actionOptions
-  }
+    "insert": _insert,
+    "reInit": _reInit,
+    "reset": _reset,
+    "setAction": _setAction,
+    "title": _title,
+    "setHeader": _setHeader,
+    "buttonText": _buttonText,
+    "resetButton": _resetButton,
+    "actionOptions": _actionOptions
+  };
 
   return BaseFormPanel;
 
@@ -48,12 +48,12 @@ define(function(require) {
       this.advancedElement = $(that.htmlAdvanced()).appendTo( $(".advancedForms", context) );
     }
 
-    Foundation.reflow(context, 'abide');
+    Foundation.reflow(context, "abide");
 
     that.reInit(context);
 
     // Mutation observer to reInit abide when nodes are added/removed
-    $('#' + that.formPanelId + 'Wizard, #' + that.formPanelId + 'Advanced', context).each(function(i, form){
+    $("#" + that.formPanelId + "Wizard, #" + that.formPanelId + "Advanced", context).each(function(i, form){
       var observer = new MutationObserver(function(mutations) {
         that.reInit(context);
       });
@@ -67,28 +67,28 @@ define(function(require) {
   function _reInit(context) {
     var that = this;
 
-    $('#' + that.formPanelId + 'Wizard, #' + that.formPanelId + 'Advanced', context)
-      .off('forminvalid.zf.abide').off('formvalid.zf.abide').off("submit");
+    $("#" + that.formPanelId + "Wizard, #" + that.formPanelId + "Advanced", context)
+      .off("forminvalid.zf.abide").off("formvalid.zf.abide").off("submit");
 
-    Foundation.reInit($('#' + that.formPanelId + 'Wizard, #' + that.formPanelId + 'Advanced', context));
+    Foundation.reInit($("#" + that.formPanelId + "Wizard, #" + that.formPanelId + "Advanced", context));
 
-    $('#' + that.formPanelId + 'Wizard, #' + that.formPanelId + 'Advanced', context)
-      .on('forminvalid.zf.abide', function(ev, frm) {
-        Notifier.notifyError(Locale.tr("One or more required fields are missing or malformed."));
+    $("#" + that.formPanelId + "Wizard, #" + that.formPanelId + "Advanced", context)
+      .on("forminvalid.zf.abide", function(ev, frm) {
+        Notifier.notifyError(Locale.tr("One or more required fields are missing or malformed."),ev.target,context);
         Sunstone.hideFormPanelLoading(that.tabId);
       })
       .on("submit", function(ev) {
         ev.preventDefault();
       });
 
-    $('#' + that.formPanelId + 'Wizard', context)
-      .on('formvalid.zf.abide', function(ev, frm) {
+    $("#" + that.formPanelId + "Wizard", context)
+      .on("formvalid.zf.abide", function(ev, frm) {
         that.submitWizard(frm);
         return false;
       });
 
-    $('#' + that.formPanelId + 'Advanced', context)
-      .on('formvalid.zf.abide', function(ev, frm) {
+    $("#" + that.formPanelId + "Advanced", context)
+      .on("formvalid.zf.abide", function(ev, frm) {
         that.submitAdvanced(frm);
         return false;
       });
@@ -116,7 +116,7 @@ define(function(require) {
   // @return [Object] actionOptions of the form based on the defined action
   function _actionOptions() {
     if (this.action) {
-      var actionOptions = this.actions[this.action]
+      var actionOptions = this.actions[this.action];
       if (actionOptions) {
         return actionOptions;
       } else {
@@ -138,8 +138,8 @@ define(function(require) {
   }
 
   function _setHeader(element) {
-    $(".sunstone-form-id", '#' + this.tabId).text(element.ID);
-    $('.sunstone-form-info-header', '#' + this.tabId).text(element.NAME);
+    $(".sunstone-form-id", "#" + this.tabId).text(element.ID);
+    $(".sunstone-form-info-header", "#" + this.tabId).text(element.NAME);
   }
 
   // @return [String] The buttonText of the form based on the defined action
@@ -161,4 +161,4 @@ define(function(require) {
       return false;
     }
   }
-})
+});

src/sunstone/public/app/utils/notifier.js

@@ -15,16 +15,16 @@
 /* -------------------------------------------------------------------------- */
 
 define(function(require) {
-  require('jgrowl');
+  require("jgrowl");
 
-  var Locale = require('utils/locale');
+  var Locale = require("utils/locale");
 
   //Notification of submission of action
   var _notifySubmit = function(action, args, extra_param) {
-    var action_text = action.replace(/OpenNebula\./, '').replace(/\./, ' ');
+    var action_text = action.replace(/OpenNebula\./, "").replace(/\./, " ");
 
     var msg = "";
-    if (!args || (typeof args == 'object' && args.constructor != Array)) {
+    if (!args || (typeof args === "object" && args.constructor != Array)) {
 
       msg += action_text;
     } else {
@@ -36,22 +36,26 @@ define(function(require) {
     };
 
     $.jGrowl(msg, {theme: "jGrowl-notify-submit", position: "bottom-right"});
-  }
+  };
 
   //Notification on error
-  var _notifyError = function(msg) {
+  var _notifyError = function(msg, target=undefined, context=undefined) {
+    if(target && context){
+      var tab = $(target).find($(".is-invalid-input",context)).closest(".tabs-panel",context);
+      tab.parent().siblings($(".tabs",context)).find($("a[href$=\"#"+tab.attr("id")+"\"]",context)).click();
+    }
     $.jGrowl(msg, {theme: "jGrowl-notify-error", position: "bottom-right", sticky: true});
-  }
+  };
 
   //Standard notification
   var _notifyMessage = function(msg) {
     $.jGrowl(msg, {theme: "jGrowl-notify-submit", position: "bottom-right"});
-  }
+  };
 
   var _notifyCustom = function(title, msg, sticky) {
     msg = (title ? title + "</br>" : "") + msg;
     $.jGrowl(msg, {theme: "jGrowl-notify-submit", position: "bottom-right", sticky: sticky});
-  }
+  };
 
   //standard handling for the server errors on ajax requests.
   //Pops up a message with the information.
@@ -122,13 +126,13 @@ define(function(require) {
 
     _notifyError(message);
     return true;
-  }
+  };
 
   return {
-    'notifySubmit': _notifySubmit,
-    'notifyError': _notifyError,
-    'notifyMessage': _notifyMessage,
-    'notifyCustom': _notifyCustom,
-    'onError': _onError
-  }
+    "notifySubmit": _notifySubmit,
+    "notifyError": _notifyError,
+    "notifyMessage": _notifyMessage,
+    "notifyCustom": _notifyCustom,
+    "onError": _onError
+  };
 });

src/sunstone/public/scss/_tabs.scss

@@ -4,6 +4,7 @@
   .tabs-title {
     margin-bottom: rem-calc(-2px);
     text-align: center;
+    max-height: rem-calc(56px);
 
     a {
       font-weight: 300;
@@ -81,4 +82,4 @@
 
 .tabs-add {
   width: 60%;
-}
+}