Transform the results of an HTML form into HASH with JQuery and JavaScript

0

I'm trying to see the credit card hash informed to test with Moip, but my Javascript does not show me on the screen, it returns me [Object, Object], I would like to see the complete hash to pass to Moip. >

PS: Moip's sample credit card link is: link

a>

Follow the example:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>
    <form action="">
        <input type="text" id="number">
        <input type="text" id="cvc">
        <input type="text" id="month">
        <input type="text" id="year">
        <input type="button" id="encrypt" value="Pagar">
    </form>

    <script src="http://assets.moip.com.br/v2/moip.min.js"></script><scriptsrc="http://code.jquery.com/jquery-3.2.1.min.js"></script>

    <script>
        $(document).ready(function(){
            $('#encrypt').click(function() {
                var cc = new Moip.CreditCard({
                    number: $('#number').val(),
                    cvc: $('#cvc').val(),
                    expMonth: $('#month').val(),
                    expYear: $('#year').val(),
                    pubKey: '-----BEGIN PUBLIC KEY-----
MIIBIjANBgkqhkiG9w0BAQEFAAOCAQ8AMIIBCgKCAQEAvUe2JrQN+L8ZFOCNQ41k
Adnrz2nEMPG/lJoeRJedrD9T7resZ8R6T2Uhq2A8R8yyrb7Lj/4VYFkHpzqqMmau
LQgXxS0lYkHDLYmYipBC+VYpm5Yu2E3JlDjjmjkhafF44PqXLb1SncXALohWit8F
G95evAuXc3/YcKBxhLX81qBVNzFFYR12ertYE7IFLv/RogqxaB62S4Ld4IfacKGF
g3qGUX8XteOXml/497tk6EDOZPZI2C7mGFVi0SctI2nzCk/5Q0vCHlMeYp0JhVQJ
jVgxaASQlr1GjNrUMNee28O4DQxktU9sldwLLlwYpAYKYgGkH505AbkLC3jAa9qp
swIDAQAB
-----END PUBLIC KEY-----'
                });

                if (cc.isValid()) {                    
                    $('#debug').text(cc.hash());
                    var verifica = $('#debug').text(cc.hash());
                    alert(verifica);
                } else {                    
                    console.log('Cartão Inválido');
                }
            });
        });    
    </script>

</body>
</html>
    
asked by anonymous 26.07.2018 / 17:17

1 answer

1

First, you do not have an element with the "debug" id in your html, and even if you had it you should alert it by its .val() , in case of an input, or .text() , if it is of a <div> , <span> , <p> , and so on.

$(document).ready(function() {
  $('#encrypt').click(function() {
    var cc = new Moip.CreditCard({
      number: $('#number').val(),
      cvc: $('#cvc').val(),
      expMonth: $('#month').val(),
      expYear: $('#year').val(),
      pubKey: '-----BEGIN PUBLIC KEY-----
MIIBIjANBgkqhkiG9w0BAQEFAAOCAQ8AMIIBCgKCAQEAvUe2JrQN+L8ZFOCNQ41k
Adnrz2nEMPG/lJoeRJedrD9T7resZ8R6T2Uhq2A8R8yyrb7Lj/4VYFkHpzqqMmau
LQgXxS0lYkHDLYmYipBC+VYpm5Yu2E3JlDjjmjkhafF44PqXLb1SncXALohWit8F
G95evAuXc3/YcKBxhLX81qBVNzFFYR12ertYE7IFLv/RogqxaB62S4Ld4IfacKGF
g3qGUX8XteOXml/497tk6EDOZPZI2C7mGFVi0SctI2nzCk/5Q0vCHlMeYp0JhVQJ
jVgxaASQlr1GjNrUMNee28O4DQxktU9sldwLLlwYpAYKYgGkH505AbkLC3jAa9qp
swIDAQAB
-----END PUBLIC KEY-----'
    });

    if (cc.isValid()) {
      var verifica = cc.hash();
      $('#debug').text(hash);      
      console.log(hash);
    } else {
      console.log('Cartão Inválido');
    }
  });
});
<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>Document</title>
</head>

<body>
  <form action="">
    <input type="text" id="number" placeholder="Number">
    <input type="text" id="cvc" placeholder="CVC">
    <input type="text" id="month" placeholder="month">
    <input type="text" id="year" placeholder="year">
    <input type="button" id="encrypt" value="Pagar">
  </form> 
  <span id="debug"></span>
  <script src="http://assets.moip.com.br/v2/moip.min.js"></script><scriptsrc="http://code.jquery.com/jquery-3.2.1.min.js"></script>
    
26.07.2018 / 17:45