Merge pull request #8777 from rebecca-shoptaw/8423/show-error-msg-wit…

…hout-clearing-input Show error messages without clearing inputs in edition edit page
internetarchive · Feb 22, 2024 · 526765c · 526765c
2 parents ceca4cc + c4f799c
commit 526765c
Show file tree

Hide file tree

Showing 4 changed files with 24 additions and 17 deletions.
diff --git a/openlibrary/plugins/openlibrary/js/edit.js b/openlibrary/plugins/openlibrary/js/edit.js
@@ -79,6 +79,7 @@ export function initRoleValidation() {
                 return error('#role-errors', '#role-name', dataConfig['You need to give this ROLE a name.'].replace(/ROLE/, data.role));
             }
             $('#role-errors').hide();
+            $('#select-role, #role-name').val('');
             return true;
         }
     });
@@ -97,7 +98,9 @@ export function isbnConfirmAdd(data) {
 
     const yesButtonSelector = '#yes-add-isbn'
     const noButtonSelector = '#do-not-add-isbn'
-    const onYes = () => {$('#id-errors').hide()};
+    const onYes = () => {
+        $('#id-errors').hide();
+    };
     const onNo = () => {
         $('#id-errors').hide();
         isbnOverride.clear();
@@ -122,8 +125,8 @@ export function isbnConfirmAdd(data) {
 function validateIsbn10(data, dataConfig, label) {
     data.value = parseIsbn(data.value);
 
-    if (isFormatValidIsbn10(data.value) === false) {
-        return error('#id-errors', 'id-value', dataConfig['ID must be exactly 10 characters [0-9] or X.'].replace(/ID/, label));
+    if (!isFormatValidIsbn10(data.value)) {
+        return error('#id-errors', '#id-value', dataConfig['ID must be exactly 10 characters [0-9] or X.'].replace(/ID/, label));
     }
     // Here the ISBN has a valid format, but also has an invalid checksum. Give the user a chance to verify
     // the ISBN, as books sometimes issue with invalid ISBNs and we want to be able to add them.
@@ -147,7 +150,7 @@ function validateIsbn13(data, dataConfig, label) {
     data.value = parseIsbn(data.value);
 
     if (isFormatValidIsbn13(data.value) === false) {
-        return error('#id-errors', 'id-value', dataConfig['ID must be exactly 13 digits [0-9]. For example: 978-1-56619-909-4'].replace(/ID/, label));
+        return error('#id-errors', '#id-value', dataConfig['ID must be exactly 13 digits [0-9]. For example: 978-1-56619-909-4'].replace(/ID/, label));
     }
     // Here the ISBN has a valid format, but also has an invalid checksum. Give the user a chance to verify
     // the ISBN, as books sometimes issue with invalid ISBNs and we want to be able to add them.
@@ -171,7 +174,8 @@ function validateLccn(data, dataConfig, label) {
     data.value = parseLccn(data.value);
 
     if (isValidLccn(data.value) === false) {
-        return error('#id-errors', 'id-value', dataConfig['Invalid ID format'].replace(/ID/, label));
+        $('#id-value').val(data.value);
+        return error('#id-errors', '#id-value', dataConfig['Invalid ID format'].replace(/ID/, label));
     }
     return true;
 }
@@ -187,14 +191,15 @@ export function validateIdentifiers(data) {
     const dataConfig = JSON.parse(document.querySelector('#identifiers').dataset.config);
 
     if (data.name === '' || data.name === '---') {
-        return error('#id-errors', 'select-id', dataConfig['Please select an identifier.'])
+        $('#id-value').val(data.value);
+        return error('#id-errors', '#select-id', dataConfig['Please select an identifier.'])
     }
     const label = $('#select-id').find(`option[value='${data.name}']`).html();
     if (data.value === '') {
-        return error('#id-errors', 'id-value', dataConfig['You need to give a value to ID.'].replace(/ID/, label));
+        return error('#id-errors', '#id-value', dataConfig['You need to give a value to ID.'].replace(/ID/, label));
     }
     if (['ocaid'].includes(data.name) && /\s/g.test(data.value)) {
-        return error('#id-errors', 'id-value', dataConfig['ID ids cannot contain whitespace.'].replace(/ID/, label));
+        return error('#id-errors', '#id-value', dataConfig['ID ids cannot contain whitespace.'].replace(/ID/, label));
     }
 
     let validId = true;
@@ -214,11 +219,10 @@ export function validateIdentifiers(data) {
     if (isIdDupe(entries, data.value) === true) {
         // isbnOverride being set will override the dupe checker, so clear isbnOverride if there's a dupe.
         if (isbnOverride.get()) {isbnOverride.clear()}
-        return error('#id-errors', 'id-value', dataConfig['That ID already exists for this edition.'].replace(/ID/, label));
+        return error('#id-errors', '#id-value', dataConfig['That ID already exists for this edition.'].replace(/ID/, label));
     }
 
     if (validId === false) return false;
-
     $('#id-errors').hide();
     return true;
 }
@@ -243,6 +247,7 @@ export function initClassificationValidation() {
                 return error('#classification-errors', '#classification-value', dataConfig['You need to give a value to CLASS.'].replace(/CLASS/, label));
             }
             $('#classification-errors').hide();
+            $('#select-classification, #classification-value').val('');
             return true;
         }
     });
@@ -394,6 +399,7 @@ export function initEditExcerpts() {
                 return error('#excerpts-errors', '#excerpts-excerpt', 'That excerpt is too long.')
             }
             $('#excerpts-errors').hide();
+            $('#excerpts-excerpt').val('');
             return true;
         }
     });
@@ -443,6 +449,7 @@ export function initEditLinks() {
                 return false;
             }
             $('#link-errors').addClass('hidden');
+            $('#link-label, #link-url').val('');
             return true;
         }
     });

diff --git a/openlibrary/plugins/openlibrary/js/jquery.repeat.js b/openlibrary/plugins/openlibrary/js/jquery.repeat.js
@@ -39,25 +39,25 @@ export default function($){
         /**
          * Search elems.form for input fields and create an
          * object representing.
-         * This function has side effects and will reset any
-         * input[type=text] fields it has found in the process
          * @return {object} data mapping names to values
          */
         function formdata() {
             var data = {};
             $(':input', elems.form).each(function() {
                 var $e = $(this),
+                    name = $e.attr('name'),
                     type = $e.attr('type'),
-                    name = $e.attr('name');
+                    _id = $e.attr('id');
 
                 data[name] = $e.val().trim();
-                // reset the values we are copying across
-                if (type === 'text') {
+
+                if (type === 'text' && _id === 'id-value') {
                     $e.val('');
                 }
             });
             return data;
         }
+
         /**
          * triggered when "add link" button is clicked on author edit field.
          * Creates a removable `repeat-item`.

diff --git a/openlibrary/templates/books/edit/excerpts.html b/openlibrary/templates/books/edit/excerpts.html
@@ -1,6 +1,6 @@
 $def with (work)
 
-<div id="excerpts-errors" class="note hidden">
+<div id="excerpts-errors" class="note" style="display: none">
 </div>
 
 <fieldset class="major" id="addexcerpts">

diff --git a/openlibrary/templates/books/edit/web.html b/openlibrary/templates/books/edit/web.html
@@ -24,7 +24,7 @@
                     <label for="link-url">URL</label>
                 </div>
                 <div class="input">
-                    <input type="text" name="url" id="link-url" class="addweb" value="https://"/>
+                    <input type="text" name="url" id="link-url" class="addweb" value="https://" />
                     <input type="button" id="repeat-add" class="repeat-add" value="Add Link"/>
                 </div>
             </div>