title: E_WC_14: Accept.js encryption failed?
body: <p>I have a payment form as follows</p>
  
  <pre><code>&lt;body&gt;
      &lt;g:if test="${flash.message}"&gt;
          &lt;div class="message"&gt;${flash.message}&lt;/div&gt;
      &lt;/g:if&gt;
      &lt;div class="content"&gt;
      &lt;h1&gt;Secure Checkout&lt;/h1&gt;
  
          &lt;g:form name="paymentForm"
                method="POST"
                action="processAcceptPayment" &gt;
              &lt;input type="text" name="cardNumber" id="cardNumber" placeholder="cardNumber"/&gt; &lt;br&gt;&lt;br&gt;
              &lt;input type="text" name="expMonth" id="expMonth" placeholder="expMonth"/&gt; &lt;br&gt;&lt;br&gt;
              &lt;input type="text" name="expYear" id="expYear" placeholder="expYear"/&gt; &lt;br&gt;&lt;br&gt;
              &lt;input type="text" name="cardCode" id="cardCode" placeholder="cardCode"/&gt; &lt;br&gt;&lt;br&gt;
              &lt;input type="hidden" name="dataValue" id="dataValue" /&gt;
              &lt;input type="hidden" name="dataDescriptor" id="dataDescriptor" /&gt;
              &lt;button type="button" onclick="sendPaymentDataToAnet()"&gt;Pay&lt;/button&gt;
          &lt;/g:form&gt;
  
  
      &lt;/div&gt;
  
  
  
  
  &lt;g:javascript&gt;
  
  
      function sendPaymentDataToAnet() {
          var authData = {};
          authData.clientKey = "valid key";
          authData.apiLoginID = "valid id";
  
          var cardData = {};
          cardData.cardNumber = document.getElementById("cardNumber").value;
          cardData.month = document.getElementById("expMonth").value;
          cardData.year = document.getElementById("expYear").value;
          cardData.cardCode = document.getElementById("cardCode").value;
  
          var secureData = {};
          secureData.authData = authData;
          secureData.cardData = cardData;
          // If using banking information instead of card information,
          // send the bankData object instead of the cardData object.
          //
          // secureData.bankData = bankData;
  
          Accept.dispatchData(secureData, responseHandler);
  
      }
  
      function responseHandler(response) {
          if (response.messages.resultCode === "Error") {
              var i = 0;
              while (i &lt; response.messages.message.length) {
                  console.log(
                          response.messages.message[i].code + ": " +
                          response.messages.message[i].text
                  );
                  i = i + 1;
              }
          } else {
              paymentFormUpdate(response.opaqueData);
          }
      }
  
      function paymentFormUpdate(opaqueData) {
          document.getElementById("dataDescriptor").value = opaqueData.dataDescriptor;
          document.getElementById("dataValue").value = opaqueData.dataValue;
  
          document.getElementById("cardNumber").value = "";
          document.getElementById("expMonth").value = "";
          document.getElementById("expYear").value = "";
          document.getElementById("cardCode").value = "";
          document.getElementById("accountNumber").value = "";
          document.getElementById("routingNumber").value = "";
          document.getElementById("nameOnAccount").value = "";
          document.getElementById("accountType").value = "";
  
          document.getElementById("paymentForm").submit();
      }
  
  
  &lt;/g:javascript&gt;
  &lt;/body&gt;
  </code></pre>
  
  <p>This generates the form as follows</p>
  
  <p><a href="https://i.stack.imgur.com/UrdCG.png" rel="noreferrer"><img src="https://i.stack.imgur.com/UrdCG.png" alt="enter image description here"></a></p>
  
  <p>I enter test credit card numbers and click Pay. </p>
  
  <p><a href="https://i.stack.imgur.com/KqkDf.png" rel="noreferrer"><img src="https://i.stack.imgur.com/KqkDf.png" alt="enter image description here"></a></p>
  
  <p>I get the following error in my javascript console.</p>
  
  <p><a href="https://i.stack.imgur.com/Id6Fo.png" rel="noreferrer"><img src="https://i.stack.imgur.com/Id6Fo.png" alt="enter image description here"></a></p>
  
  <p>I was just following the accept.js tutorial from the official page. </p>
  
  <p><a href="https://developer.authorize.net/api/reference/features/acceptjs.html" rel="noreferrer">https://developer.authorize.net/api/reference/features/acceptjs.html</a></p>
  
  <p>I appreciate any help as to the reason for this "Encryption Failed" error? Thanks!</p>
  
  <p><strong>UPDATE:</strong></p>
  
  <p>Ok so i did some more debugging. I put a test code "console.log("test");" inside responseHandler() function and noticed that it was called twice. I am now wondering why is responseHandler() being called twice. </p>