You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@airavata.apache.org by ma...@apache.org on 2018/01/11 16:18:49 UTC

[airavata-django-portal] 02/04: AIRAVATA-2598 Display validation of required inputs

This is an automated email from the ASF dual-hosted git repository.

machristie pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/airavata-django-portal.git

commit 8615c84ddc84affd5479c8e30191a3b15ab9b2d3
Author: Marcus Christie <ma...@iu.edu>
AuthorDate: Thu Jan 11 10:41:24 2018 -0500

    AIRAVATA-2598 Display validation of required inputs
---
 .../django_airavata_api/js/models/BaseModel.js     |  4 ++++
 .../js/models/InputDataObjectType.js               |  8 ++++++++
 .../django_airavata_api/js/models/Project.js       |  2 +-
 .../js/components/experiment/ExperimentEditor.vue  | 22 ++++++++++++++++++++--
 4 files changed, 33 insertions(+), 3 deletions(-)

diff --git a/django_airavata/apps/api/static/django_airavata_api/js/models/BaseModel.js b/django_airavata/apps/api/static/django_airavata_api/js/models/BaseModel.js
index 9745c90..49f773b 100644
--- a/django_airavata/apps/api/static/django_airavata_api/js/models/BaseModel.js
+++ b/django_airavata/apps/api/static/django_airavata_api/js/models/BaseModel.js
@@ -75,6 +75,10 @@ export default class BaseModel {
         return null;
     }
 
+    isEmpty(value) {
+        return value === null || (typeof value === 'string' && value.trim() === '');
+    }
+
     /**
      * Return a fully deep cloned instance of this instance.
      */
diff --git a/django_airavata/apps/api/static/django_airavata_api/js/models/InputDataObjectType.js b/django_airavata/apps/api/static/django_airavata_api/js/models/InputDataObjectType.js
index cf3e349..496de53 100644
--- a/django_airavata/apps/api/static/django_airavata_api/js/models/InputDataObjectType.js
+++ b/django_airavata/apps/api/static/django_airavata_api/js/models/InputDataObjectType.js
@@ -37,4 +37,12 @@ export default class InputDataObjectType extends BaseModel {
             this.storageResourceId = '';
         }
     }
+
+    validate() {
+        let results = {};
+        if (this.isRequired && this.isEmpty(this.value)) {
+            results['value'] = 'This field is required.';
+        }
+        return results;
+    }
 }
diff --git a/django_airavata/apps/api/static/django_airavata_api/js/models/Project.js b/django_airavata/apps/api/static/django_airavata_api/js/models/Project.js
index d6e9c99..59bc6be 100644
--- a/django_airavata/apps/api/static/django_airavata_api/js/models/Project.js
+++ b/django_airavata/apps/api/static/django_airavata_api/js/models/Project.js
@@ -18,7 +18,7 @@ export default class Project extends BaseModel {
     }
 
     validate() {
-        if (this.name === null || this.name.trim() === "") {
+        if (this.isEmpty(this.name)) {
             return {
                 name: ["Please provide a name."]
             }
diff --git a/django_airavata/apps/workspace/static/django_airavata_workspace/js/components/experiment/ExperimentEditor.vue b/django_airavata/apps/workspace/static/django_airavata_workspace/js/components/experiment/ExperimentEditor.vue
index 76040ca..77cbc00 100644
--- a/django_airavata/apps/workspace/static/django_airavata_workspace/js/components/experiment/ExperimentEditor.vue
+++ b/django_airavata/apps/workspace/static/django_airavata_workspace/js/components/experiment/ExperimentEditor.vue
@@ -47,9 +47,12 @@
                         </h2>
                         <b-form novalidate>
                             <b-form-group v-for="experimentInput in localExperiment.experimentInputs"
-                                    :label="experimentInput.name" :label-for="experimentInput.name" :key="experimentInput.name">
+                                    :label="experimentInput.name" :label-for="experimentInput.name" :key="experimentInput.name"
+                                    :feedback="getApplicationInputFeedback(experimentInput)"
+                                    :state="getApplicationInputState(experimentInput)">
                                 <b-form-input :id="experimentInput.name" type="text" v-model="experimentInput.value" required
-                                    :placeholder="experimentInput.userFriendlyDescription"></b-form-input>
+                                    :placeholder="experimentInput.userFriendlyDescription"
+                                    :state="getApplicationInputState(experimentInput)"></b-form-input>
                             </b-form-group>
                         </b-form>
                         <h2 class="h5 mb-3">
@@ -151,6 +154,21 @@ export default {
                     console.log("Launch failed!", result);
                 });
         },
+        getApplicationInputState: function(applicationInput) {
+            const validation = this.getApplicationInputValidation(applicationInput);
+            return validation !== null ? 'invalid' : null;
+        },
+        getApplicationInputFeedback: function(applicationInput) {
+            const validation = this.getApplicationInputValidation(applicationInput);
+            return validation !== null ? validation : null;
+        },
+        getApplicationInputValidation: function(applicationInput) {
+            const validationResults = applicationInput.validate();
+            if (validationResults !== null && 'value' in validationResults) {
+                return validationResults;
+            }
+            return null;
+        }
     },
     watch: {
         experiment: function(newValue) {

-- 
To stop receiving notification emails like this one, please contact
"commits@airavata.apache.org" <co...@airavata.apache.org>.