how to pass from a function to another function? (script>script) <= element
how do I pass the value of the field validator into the second function?

<script>
             $('#card_number').validateCreditCard(function(result) {
            if (result.valid) {
                const infosuccess = result.card_type == null ? '-' : result.card_type.name
                const valid = result.valid
                const validlunn = result.luhn_valid
                const validlenght = result.length_valid 
                console.log(infosuccess);
            } else {
               //  $(this)
               //  const inforeject = result.valid

               //  console.log(result);
               
            }
         }); 
         </script>

      <script>
        $('#nextaction').click(function(e) {
        e.preventDefault();
              // my code...
  })
    </script>

CodePudding user response：

You cannot pass arguments directly in to event handlers. However, there are other approaches you can use.

In this case you can set the 'Next' button to be disabled when the page loads. You can then enable/disable it depending on the result of the credit card validation.

To retrieve the entered card number you can simply read the value from the input when the button is clicked, like this:

const $cardInput = $('#card_number');
const $validateBtn = $('#validate_card');
const $nextBtn = $('#next-action');

$cardInput.validateCreditCard(function(result) {
  $nextBtn.prop('disabled', !result.valid); // enable/disable 'next' button

  if (result.valid) {
    // update the UI to show card details if necessary here...
  } else {
    console.log('enter a valid credit card number...');
  }
});

$nextBtn.on('click', function(e) {
  e.preventDefault();
  const cardNumber = $cardInput.val();
  
  console.log(cardNumber);
  console.log('move to next action here...');
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-creditcardvalidator/1.0.0/jquery.creditCardValidator.min.js" integrity="sha512-7omJBgl5QF4QuC3Ge745IO3rDZVMrZWIGK8lSs5lQIFxbWt4d2c7YQg3ZcnonFyRuQslrJ1Ai33Zj/rnXC15 Q==" crossorigin="anonymous"
  referrerpolicy="no-referrer"></script>

<p>
  Test Card number: 5404000000000084
</p>

<label>
  Credit card number:
  <input type="text" id="card_number" />
  <button type="button" id="validate_card">Validate</button>
</label>

<button type="button" id="next-action" disabled>Next...</button>