toaster: apply error class to name field

The form for naming new custom images shows you an error message when
the name already exists or you include an invalid character in it. But
when an error appears, the input field was missing the red highlight.

This patch applies the right class to the form controls whenever an
error message is shown.

Signed-off-by: Belen Barros Pena <belen.barros.pena@intel.com>
Signed-off-by: Elliot Smith <elliot.smith@intel.com>
Signed-off-by: Richard Purdie <richard.purdie@linuxfoundation.org>

diff --git a/lib/toaster/toastergui/static/js/newcustomimage_modal.js b/lib/toaster/toastergui/static/js/newcustomimage_modal.js
index 0b9d31aa6c51f90d2d40bb943378a05c74163316..328997af3be77c31a6df8b44205a22c0e2c1f460 100644 (file)
--- a/lib/toaster/toastergui/static/js/newcustomimage_modal.js
+++ b/lib/toaster/toastergui/static/js/newcustomimage_modal.js
@@ -36,6 +36,7 @@ function newCustomImageModalInit(){
   function showError(text){
     invalidNameHelp.text(text);
     invalidNameHelp.show();
+    nameInput.parent().addClass('error');
   }
 
   nameInput.on('keyup', function(){
@@ -47,9 +48,11 @@ function newCustomImageModalInit(){
     if (nameInput.val().search(/[^a-z|0-9|-]/) != -1){
       showError(invalidMsg);
       newCustomImgBtn.prop("disabled", true);
+      nameInput.parent().addClass('error');
     } else {
       invalidNameHelp.hide();
       newCustomImgBtn.prop("disabled", false);
+      nameInput.parent().removeClass('error');
     }
   });
 }