Integration of braintree causing issues

Shaunak Shukla picture Shaunak Shukla · Jul 23, 2014 · Viewed 9.9k times · Source

I'm working on Braintree for the first time and getting issues in very first step. I'm not able to access dropin functionality and other.. I need help to sort it out.

I followed steps given here : https://developers.braintreepayments.com/javascript+php/start/overview

First step is Javascript Client! - I followed as mentioned, added script

 <script src="https://js.braintreegateway.com/v2/braintree.js"></script>

Then added HTML part

<form id="checkout" method="post" action="/checkout">
  <div id="dropin"></div>
  <input type="submit" value="Pay $10">
</form>

And at last I've added below script in script tag.

braintree.setup("CLIENT_TOKEN_KEY", 'dropin', {
   container: 'checkout'
})

I have checked with Client Token Key obtained from our server.

for next step, I added configurations as mentioned

Braintree_Configuration::environment('sandbox');
Braintree_Configuration::merchantId('use_your_merchant_id'); //updated with our merchant id
Braintree_Configuration::publicKey('use_your_public_key'); // updated with our public key
Braintree_Configuration::privateKey('use_your_private_key'); //updated with our private key

then added

$clientToken = Braintree_ClientToken::generate(array(
   "customerId" => $aCustomerId 
));

Now, Issues I'm getting -

When I updated $aCustomerId with our customer id, I got a Fatal Error of "customer_id" field undefined in Braintree_ClientToken. So removed array("customer"=>$aCustomerId) and got the client token..

That client token is used in brantree.setup('TOKEN_KEY','dropin',{container:'checkout'}) and got

Error: Unable to find valid container. -braintree.js(line 18) 

I also mentioned once var braintree = Braintree.create("CLIENT_TOKEN_KEY"); above brantree.setup('TOKEN_KEY','dropin',{container:'checkout'}) at that time I've got TypeError: braintree.setup is not a function

I'm trying to sort it out this from last two days, but still I didn't get dropin screen as showed in demo.

Hope for good help..

Answer

jagseer picture jagseer · Sep 10, 2014

Place all the scripts after the html / footer section, this will work:

<?php
require_once 'braintree-php-2.30.0/lib/Braintree.php';

Braintree_Configuration::environment('sandbox');
Braintree_Configuration::merchantId('-----------');
Braintree_Configuration::publicKey('-----------');
Braintree_Configuration::privateKey('-----------');
if(isset($_POST['submit'])){
    /* process transaction */
    $result = Braintree_Transaction::sale(array(
     'amount' => '234.00',
     'creditCard' => array(
     'number' => '30569309025904',
     'expirationDate' => '05/14'
    )
  ));

if ($result->success) {
  print_r("success!: " . $result->transaction->id);
  } else if ($result->transaction) {
    print_r("Error processing transaction:");
    print_r("\n  code: " . $result->transaction->processorResponseCode);
    print_r("\n  text: " . $result->transaction->processorResponseText);
    } else {
      print_r("Validation errors: \n");
      print_r($result->errors->deepAll());
    }
}

$clientToken = Braintree_ClientToken::generate();

?>

<html>
  <head>
  </head>
  <body>
    <div id="checkout" method="post" action="/checkout">
      <div id="dropin"></div>
      <input data-braintree-name="number" value="4111111111111111">
      <input data-braintree-name="expiration_date" value="10/20">
      <input type="submit" id="submit" value="Pay">
      <div id="paypal-button"></div>
    </div>  

  <!-- Scripts -->
  <script src="https://code.jquery.com/jquery-2.1.1.js"></script>
  <script src="https://js.braintreegateway.com/v2/braintree.js"></script>
  <script>
    braintree.setup("<?php print $clientToken; ?>",  "dropin", { container:
    jQuery("#dropin") ,  form: jQuery("#checkout") , 

    paymentMethodNonceReceived: function (event, nonce) {
      // do something
      }
    });
  </script>

  </body>
</html>