HTMLify

Views: 87 | Author: djdj
<form action="#" method="POST"><input type="hidden" name="book" value="6"><table border="1"> <thead> <td>Chapter</td> <td>Old No.</td> <td>New No</td> <tr> <td>Chapter 1</td> <td>1</td> <td><input type="number" min="1" name="28" value="1" required></td> </tr> <tr> <td>Chapter 2</td> <td>2</td> <td><input type="number" min="1" name="29" value="2" required></td> </tr> <tr> <td>Chapter 3</td> <td>3</td> <td><input type="number" min="1" name="30" value="3" required></td> </tr> <tr> <td>Chapter 4</td> <td>4</td> <td><input type="number" min="1" name="32" value="4" required></td> </tr> </table><input type="submit" value="Save"></form>
<script>
  document.addEventListener('DOMContentLoaded', function () {
    document.querySelector('form').addEventListener('submit', function (event) {
      // Prevent the form from submitting initially
      event.preventDefault();
      
      // Get all input elements with type 'number'
      const numberInputs = document.querySelectorAll('input[type="number"]');
      
      // Create an array to store unique values
      const uniqueNumbers = [];
      
      // Loop through each input element
      numberInputs.forEach(function (input) {
        // Get the value of the input
        const value = input.value;
        
        // Check if the value already exists in the uniqueNumbers array
        if (uniqueNumbers.includes(value)) {
          // If value already exists, show an alert and return to prevent form submission
          alert('Please ensure all numbers are unique.');
          return;
        }
        
        // If value is unique, add it to the uniqueNumbers array
        uniqueNumbers.push(value);
      });
      
      // If all numbers are unique, submit the form
      this.submit();
    });
  });
</script>

Comments