Make sure your "validateCardNumber" function is using the "validateWithLuhn" function to do its job

Hi; any one to help me resolve validateCardNumber function that failing to validate the card number instead throwing an error and yet the vlaidateWithLuhn() seems to be working fine.

Here are the inputs

<div data-cc-digits>
         <input type="text" size= "4" placeholder="----" />
           <input type="text" size= "4" placeholder="----" />
          <input type="text" size= "4" placeholder="----" />
         <input type="text" size= "4" placeholder="----" />

// My javascript

//vlaidateWithLuhn() function that it seems to be working fine.
      const validateWithLuhn = (digits) => {
        if (digits.length != 16) {
          return false;
        } else {
        const len = digits.reverse().map((x, index) => (index % 2 == 1) ? x * 2 : x);
        const lastDigit = => (x > 9) ? x - 9: x);
        const sum = lastDigit.reduce((sum, x) => sum + x, 0);
        if (sum % 10 == 0) {
          console.log('This card No. is valid');
        } else {
          console.log('This card No. is Invalid');
        return (sum % 10) == 0;
      const addLeadingZeros = x => {
        while (x.length < 4) x = "0" + x;
        return x;
      // validate card number is validating 
      const validateCardNumber = () => {
        let digits = document.querySelectorAll('[data-cc-digits]')[0].children;
        let inputFields = Array.from(digits);
        let cardNumbers = => addLeadingZeros(input.value));
        let numString = cardNumbers.toString().replace(/\D/g, "");
        if (validateWithLuhn(numString)) {
          if (digits.classList.contains('is-invalid')) {
            console.log('Removed is-invalid')
          return true;
        } else { 
          console.log('add is-invalid')
          return false;

Any one with an idea how i can resolve this. Thanks

define. What error is it throwing?

Hi @m_hutley, this is the error Make sure your “validateCardNumber” function is using the “validateWithLuhn” function to do its job

mmh no, thats a link to this thread, where you don’t tell me what the error is.

that is the error message that am getting

is not ‘an error that you are getting’.

Syntax error: Index is not defined is javascript throwing an error. It tells me exactly what is wrong: I’ve not defined my index variable.

“its throwing an error” tells us nothing.

What does the console log when you execute this function?

Uncaught (in promise) TypeError: digits.reverse is not a function
    at validateWithLuhn (<anonymous>:120:24)
    at validateCardNumber (<anonymous>:141:10)
    at 5LRCZiMHJysdZgHVNPUa.js:1134
    at (<anonymous>)
    at bulkCheck (5LRCZiMHJysdZgHVNPUa.js:1115)
    at checkValidateCardNumberFn (5LRCZiMHJysdZgHVNPUa.js:1148)
    at audit-utils.js:110
    at audit-utils.js:87
    at async https:/
    at async auditJavascript (audit-utils.js:126)


VM1073:182 TypeError: Cannot read property 'focus' of undefined
    at uiCanInteract (<anonymous>:158:47)
    at displayCartTotal (<anonymous>:172:5)
    at <anonymous>:179:9

well see, there’s your problem then.

digits is a string.
String does not have a method called reverse(). Reverse is an Array method.

Okay thanks, any suggestion of what i need to use.

Well considering map will also be expecting an array, you’d better turn your string into an array, right?


Okay, thanks @m_hutley

Though still getting this message
image in the

// validate card number
      const validateCardNumber = () => {
        const digits = document.querySelectorAll("[data-cc-digits]")[0].children;
        const inputFields = Array.from(digits);
        const cardNumber = => addLeadingZeros(input.value));
        let numString = cardNumber.toString().replace(/\D/g, "");
        let isValidCardNumber = validateWithLuhn(cardNumber);
        if (isValidCardNumber) {
          if (digits.classList.contains('is-invalid')) {
            console.log('Removed is-invalid')
          return true;
        } else {
          console.log('Removed is-invalid')
          return false;
        return isValidCardNumber;

and here is my console

Take a look at the values of lastDigit and sum and you might find out why.

This worked for me. thanks @m_hutley

const validateCardNumber = () => {
   	  const div = document.querySelector('[data-cc-digits]');
   	  const inputs = document.querySelectorAll('[data-cc-digits] input');
   	  const values = [], input => input.value).join('');
   	  const re = /^[0-9]{16}$/;
   	  let isValid = re.test(values);
   	  if (isValid) {
   		  const digits = [...values].map(x => +x);
   		  isValid = validateWithLuhn(digits);
   	  flagIfInvalid(div, isValid);
   	  return isValid;

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.